重要得之前的知识
浏览器
shell ?内核
外表 ???内心
IE ?????????????trident
Firefox ????????Gecko
google chrome ??webkit/blink
safari ?????????webkit
opera ??????????presto
css 权重
!important > 行间样式 > id > class | 属性 > 标签选择器 > 通配符
！important ?????Infinity ?正无穷
行间样式 ?????????1000
id ??????????????100
class|属性|伪类 ??10
标签|伪元素 ??????1
通配符 ??????????0
1000和100 ??256进制
一位工程师手测试出来的
浏览器父子选择器的内部原理是由右到左查找
设置字体大小实际上是设置字体的高
三角形用的是border设置
段落 text-indent: 2em;
1em = 1 * font-size
1.行级元素/内联标签 ?display:inline
feature:内容决定元素所占位置
???????不可以通过css改变宽高
???span strong em a del
2.块级元素 ?display:block
feature:独占一行
???????可以通过css改变宽高
???div p ul li ol form address
3.行级块元素 ?inline-block
feature:内容决定大小
???????可以改宽高
???img
凡是带有inline的元素，都有文字特性
代码压缩，去掉了空格回车，所以img不能用margin调节间距
先定义功能（先写CSS）非常重要！
em可以自定义功能
a标签去掉下划线:text-decoration:none;
ui标签去掉圆点:list-style:none;
???padding:0;
???margin:0;
通配符用法
初始化标签
*{
???padding:0;
???margin:0;
???text-decoration:none; ?
???list-style:none; ??????
}
盒子模型
盒子三大部分
盒子壁 ?border
内边距 ?padding
外边距 ?margin
盒子内容 width + height
padding : 四个参数：上 右 下 左 ?三个参数：上 左右 下 两个参数：上下 左右 一个参数：全都有
body的margin 默认为8px
position
???????absolute
???????????脱离原来位置进行定位
???????????相当于最近的有定位的父级进行定位
???????????如果没有，那么相对于文档进行定位
???????relative
???????????保留原来位置进行定位
???????????相当于自己本身原来的位置进行定位
???????fixed
???????????固定定位
用relative作为位置，用absolute进行定位
居中：
html:
<div></div>
css:
div{
???positoin:absolute/fixed; a..相对于文档中间 f..相对于浏览器中间
???left:50%;
???top:50%;
???width:100px;
???height:100px;
???
???margin-left:-50px;width * 0.5
???margin-top:-50px;height * 0.5
}
z-index:*; position 层的优先显示
border-radius:50%
web 学习
原文地址：https://www.cnblogs.com/GhostCatcg/p/9332904.html