![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
移动端
前端的移动端兼容相关
前端二狗子
这个作者很懒,什么都没留下…
展开
-
前端常用单位:em和rem简单介绍
em(容易出错)相对于父级元素的font-size计算而来本级元素字体大小(单位为px)=父级元素的字体大小(转化为px) * 本级元素em的值例如:父级元素:20px,子级元素的1em相当于20px若父级元素的单位也是em,则一层层往上找,直到找到单位为px的元素。例如:父级元素的font-size为0.8em,父级元素的上一级元素的font-size为20px则父级元素的font-size为0.8*20=16px。则子级元素的1em相当于16px因为这个特性,多级嵌套的元素若是原创 2020-09-12 22:06:10 · 3386 阅读 · 0 评论 -
【前端响应式】媒体查询(@media)
功能:根据不同的页面属性(主要是宽度)设置不同的样式基本用法/*1.屏幕宽度在300px以上的样式*/@media screen and (min-width:300px){}/*2.屏幕宽度在600px以下的样式*/@media screen and (max-width:600px){}/*3.屏幕宽度在300px以上,600px以下的样式*/@media screen and (min-width:300px) and (max-width:600px){}含义(min原创 2020-09-13 13:12:15 · 1292 阅读 · 0 评论 -
【前端响应式】栅格基础原理及实现
功能1:基础响应式栅格float + 百分比宽度功能2:列偏移margin功能3:多种设备不同样式媒体查询media功能4:列排序float设置为right例子<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=原创 2020-09-13 15:00:10 · 383 阅读 · 0 评论