上一页 1 2 3 4 5 6 7 8 ··· 24 下一页
摘要: 视口(viewport)就是浏览器显示页面内容的屏幕区域,视口可以分为布局视口、视觉视口和理想视口 布局视口 (layout viewport) 一般移动设备的浏览器都默认设置了一个布局视口,用于解决早起的PC端页面在手机上显示的问题 IOS,Android基本都将这个视口分辨率设置为980px,所 阅读全文
posted @ 2022-03-28 14:20 洛飞 阅读(136) 评论(0) 推荐(0) 编辑
摘要: 今天看到京东的图片格式使用的是webp 然后研究了一下webp到底是什么样的图片格式,以后自己学习的时候,可以用起来 具体的内容可以看链接:https://www.jianshu.com/p/cd6f21e1cfdd 阅读全文
posted @ 2022-03-28 10:33 洛飞 阅读(122) 评论(0) 推荐(0) 编辑
摘要: 知道移动问的开发现状 写出标准的viewport 会移动web的调试方法 说出移动端常见的布局方案 能描述流式布局 独立完成移动端布局 需要的知识:移动端基础、视口、二倍图、移动端调试、移动端技术解决方案、移动端常见布局、移动端开发之流式布局、移动端首页制作 移动端调试方法: Chrome DevT 阅读全文
posted @ 2022-03-28 10:03 洛飞 阅读(25) 评论(0) 推荐(0) 编辑
摘要: 控制子元素是否开启三维立体环境 transform-style:flat 子元素不开启3D立体空间 默认的 transform-style:perserve-3d 子元素开启立体空间 代码写给父级,但是影响的是子盒子 这个属性和重要,写3D的时候会用到 实现如下效果 思路:两个盒子,相对于父元素进行 阅读全文
posted @ 2022-03-24 15:24 洛飞 阅读(30) 评论(0) 推荐(0) 编辑
摘要: 透视 perspective 在2D平面产生近大远小视觉立体,但是只是效果二维的 如果想要再网页产生3D效果需要透视(理解成3D物体投影在2D平面内) 模拟人类的视觉位置,可认为安排一只眼睛去看 透视我们也称之为视距:视距就是人的眼睛到屏幕的距离 距离视觉点越近的电脑平面成像越大,越远成像越小 透视 阅读全文
posted @ 2022-03-24 10:31 洛飞 阅读(42) 评论(0) 推荐(0) 编辑
摘要: 3D是有三维坐标系的 三维坐标系其实就是立体空间,立体空间是由3个轴共同组成的。 x轴:水平向右 注意:x右边是正值,左边是负值 y轴:垂直向下 注意:y下面是正值,上面是负值 z轴:垂直屏幕 注意:z往外是正值,往里是负值 主要学习知识 3D位移:translate3d(x,y,z) 3D旋转:r 阅读全文
posted @ 2022-03-24 09:45 洛飞 阅读(42) 评论(0) 推荐(0) 编辑
摘要: 实现下图的功能 思路: 利用动画拖动背景图片,动画设置步长,这种情况要特别注意动画在100%的时候最后落的位置,我这个代码就是100%最后设置为right bottom没有到达预期的效果,最后设置-1600px才可以 <!DOCTYPE html> <html lang="en"> <head> < 阅读全文
posted @ 2022-03-23 17:11 洛飞 阅读(116) 评论(0) 推荐(0) 编辑
摘要: 动画的速度曲线如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" 阅读全文
posted @ 2022-03-23 15:03 洛飞 阅读(120) 评论(0) 推荐(0) 编辑
摘要: 如图所示:显示如下功能: 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="vi 阅读全文
posted @ 2022-03-23 11:08 洛飞 阅读(45) 评论(0) 推荐(0) 编辑
摘要: animate具有如下属性 阅读全文
posted @ 2022-03-23 08:56 洛飞 阅读(172) 评论(0) 推荐(0) 编辑
上一页 1 2 3 4 5 6 7 8 ··· 24 下一页