层次、结构伪类、属性选择器、盒子型模

层次选择器

选择器 | 类 型 | 功能描述
-------- | -----
E F | 后代选择器 |选择匹配的F元素，且匹配的F元素被包含在匹配的E元素内
E>F| 子选择器 | 选择匹配的F元素，且匹配的F元素是匹配的E元素的子元素
E+F | 相邻兄弟选择器 |选择匹配的F元素，且匹配的F元素是匹配的E元素的子元素
E~F | 通用兄弟选择器 | 选择匹配的F元素，且位于匹配的E元素后的所有匹配的F元素

结构伪类选择器

属性选择器

边框

边框粗细

border-width
thin
medium
thick
像素值

边框样式

border-style
none
hidden
dotted
dashed
solid
double

border简写

同时设置边框的颜色、粗细和样式
border:1px solid #3a6587;
border: 1px dashed red;

外边距

margin-top: 1 px
margin-right : 2 px
margin-bottom : 2 px
margin-left : 1 px
margin :3px 5px 7px 4px;
margin :3px 5px;
margin :3px 5px 7px;
margin :8px;

外边距的妙用

网页居中对齐-----margin:0px auto;

内边距

padding-left:10px;
padding-right: 5px;
padding-top: 20px;
padding-bottom:8px;
padding:20px 5px 8px 10px ;
padding:10px 5px;
padding:30px 8px 10px ;
padding:10px;

内边距

盒子型模的尺寸