网页移动布局
文章平均质量分 63
殿君不是殿军
这个作者很懒,什么都没留下…
展开
-
获取鼠标在盒子内的坐标
案列分析: 我们在盒子内点击, 想要得到鼠标距离盒子左右的距离。 首先得到鼠标在页面中的坐标( e.pageX, e.pageY) 其次得到盒子在页面中的距离(box.offsetLeft, box.offsetTop) 用鼠标距离页面的坐标减去盒子在页面中的距离, 得到 鼠标在盒子内的坐标 案例代码: <style> .box { margin: 200px auto; width: 400px;原创 2022-05-24 11:11:24 · 247 阅读 · 0 评论 -
移动web
字体图标 作用: 使用字体图标技巧实现网页中简洁的图标效果 图标库: Iconfont:https://www.iconfont.cn/ 引入样式表: 调用图标对应的类名,必须调用2个类名 平面转换 使用transform属性实现元素的位移、旋转、缩放等效果 属性:transform 目标:使用translate实现元素位移效果 语法:transform: translate平移动距离, 垂直移动距离); 注意: X正向为右,Y轴正向为下 可以盖住标准流,但原创 2022-03-10 10:59:11 · 93 阅读 · 0 评论 -
a标签小问题
解决a标签小问题 a标签是行内元素,在给标签设置宽高时,要添加display属性,如果转换为行内块的话,会出现一个小问题: 就是在换行的时候会有一个小间隙,为了防止出现这种情况,我们应该给a标签的父级添加flex布局,这样就克服了有小间隙的问题。 ...原创 2022-03-08 14:35:19 · 298 阅读 · 0 评论 -
介绍移动布局
移动布局 移动适配指网页元素的宽高都要随着设备的宽度等比例缩放 解决方案: rem :目前多数企业在用的解决方案 (尺寸单位) vw / vh:未来的解决方案 rem是什么 rem是一个相对单位 是相对于HTML标签的字号计算结果 1rem=1HTML标签字号大小 比如:HTML标签字号大小为font-size:20px则1rem=20,5rem=5*20=100px HTML网页根标签就是html标签 /* 1rem = 1html标签字号大小 */原创 2022-03-08 08:50:56 · 125 阅读 · 0 评论 -
介绍移动布局
> **移动适配**指网页元素的宽高都要随着设备的宽度**等比例缩放** > **解决方案:** > > 0. `rem :`目前多数企业在用的解决方案 (尺寸单位) > 0. `vw / vh:`未来的解决方案 ## rem是什么 > 0. rem是一个**相对单位** > > 0. 是相对于HTML标签的字号计算结果 > > 0. 1rem=1HTML标签字号大小 > > - 比如:HTML标签字号大小为...原创 2022-03-08 08:46:56 · 104 阅读 · 0 评论