CSS学习记录4

列表

list-style:none;(去除标志) disc square circle

浮动

让元素脱离文档流

让块级元素在同行中显示

float:left;

float:right;

改变的是z轴

清除浮动

（1）在浮动元素后清除 clear:left; right; both;

（2）给浮动元素的父级固定高度（块级元素独占一行）

（3）给父级元素加上一个属性（height:auto；）

overflow:hidden;

本意：裁剪超出<div>范围的内容

盒模型：

1、外边距

margin-top:          上

margin-bottom:    下

margin-left:          左

margin-right：     右

margin:0 auto;     水平方向居中

简写

margin:10px 20px 30px 40px; （上右下左）

三个值(第四个值为第二个的值)

margin:10px 20px 30px;          （上10px右20px下30px左20px）

两个个值

margin:10px 20px;                   （上下10px左右20px）

一个值

margin:10px;                            （上右下左都是10px）

行级元素

margin-left;margin-right;

2、内边距(产生的间距要计算到容器中)

padding-top:         上

padding-bottom:   下

padding-left:         左

padding-right:       右

简写

padding:10px 20px 30px 40px; （上右下左）

三个值(第四个值为第二个的值)

padding:10px 20px 30px; （上10px右20px下30px左20px）

两个个值

padding:10px 20px;         （上下10px左右20px）

一个值

padding:10px;                  （上右下左都是10px）

padding:10px;                    上右下左

3、边框

border-left-color:

border-right-color:

border-top-color:

border-bottom-color:

宽度

border-left-width:

border-right-width:

border-top-width:

border-bottom-width:

样式

border-left-style:solid  细实线

border-left-style:double 双实线

border-left-style:dotted 点线

border-left-style:dashed 虚线

简写

border：red 1px solid;

去除边框

border-left:none;