viewport通过meta标签可以进行视口的设置
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">| 属性 | 解释说明 |
|---|---|
| width | 设置视口的宽度，device-width表示当前设备的宽度 |
| user-scalable | 设置用户是否可以缩放，yes/no |
| initial-scale | 初识缩放比 |
| maximum-scale | 最大缩放比 |
| minimum-scale | 最小缩放比 |
之后开发专门针对于移动端网页时，一般都需要加上以上meta标签，这算是移动web的第一个注意点。
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
-webkit-user-select: none;
-moz-user-focus: none;
-moz-user-select: none; a,a:hover,a:active,a:visited,a:link,a:focus{
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-tap-highlight-color: transparent;
outline:none;
background: none;
text-decoration: none;
}::selection {
background: #FFF;
color: #333;
}
::-moz-selection {
background: #FFF;
color: #333;
}
::-webkit-selection {
background: #FFF;
color: #333;
} -webkit-tap-highlight-color:rgba(0,0,0,0);方法：
缺点:会在页面中添加额外的标签，会让页面的HTML结构变得复杂
基本写法：
.clearfix::after{
content:'';
display:block
clear:both
}补充写法：
.clearfix::after{
content:'';
clear:both
/* 补充代码：在网页中看不到伪元素 */
height:0;
visibility:hidden;
}优点:项目中使用，直接给标签加类即可清除浮动
.clearfix::before,
.clearfix::after{
content:'';
display:table;
}
.clearfix::after{
clear:both;
}优点：项目中使用，直接给标签加类即可清除浮动
(拓展补充)
➢ 块格式化上下文(Block Formatting Context):BFC
是Web页面的可视CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。
➢ 创建BFC方法:
➢ BFC盒子常见特点:
