1、渐变
1、线性渐变
background-image:linear-gradient(angle,color-point,color-point);
ex:
background-image:linear-gradient(to bottom,#f9f9f9,#cdcdcd);
2、径向渐变
background-image:radial-gradient([size at position],color-point,…);
3、重复渐变
属性：background-image
取值：
repeating-linear-gradient()
repeating-radial-gradient()
4、浏览器兼容性
浏览器前缀：
Firefox ：-moz-
Chrome&Safari:-webkit-
Opera:-o-
IE : -ms-
1、如果浏览器不支持属性的话，那么将前缀添加在属性名称前
animation:值;
-webkit-animation:值;
-moz-animation:值;
-o-animation:值;
-ms-animation:值;
2、如果浏览器不支持值得话，那么将前缀添加在值前面
background-image:-webkit-linear-gradient();
2、文本格式化
1、字体属性
font-family
font-size
font-style
font-weight
font-variant
font:style variant weight size family;
2、文本属性
color
text-align:left/center/right;
text-decoration:none/underline/overline/line-through
line-height
text-indent
text-shadow:h v blur color;
3、表格
1、表格特有属性
1、边框合并
属性：border-collapse
取值：
1、separate ：分离边框，默认值
2、collapse : 合并边框
2、边框边距
属性：border-spacing
取值：
1个值：水平垂直间距相等
2个值：
第1个值表示水平间距
第2个值表示垂直间距
3、标题位置
属性：caption-side
取值：
1、top:默认值
2、bottom
4、显示规则
属性：table-layout
取值：
1、auto
自动表格布局
由内容来决定单元格大小
传统表格布局
速度较慢
2、fixed
固定表格布局
由设定的值来决定单元格大小
加载速度较快，不够灵活
1、浮动(重难点)
2、显示
3、列表
4、定位(重难点)
1、浮动
1、定位
1、什么是定位
元素该出现在网页的哪个位置处
2、定位方式
1、普通流定位
2、浮动定位
3、相对定位
4、绝对定位
5、固定定位
3、普通流定位
又称为 文档流定位
网页元素默认定位方式
页面元素
块级元素-从上到下的方式排列
行内元素-从左到右的方式排列
<body>
<div id="d1">Hello</div>
<div id="d2">World</div>
<span>Hello</span>
<span>World</span>
</body>
4、浮动定位
1、什么是浮动定位
如果将元素的定位方式设定为浮动定位的话，那么它将具备以下特征
1、浮动元素 会被排除在文档流之外-脱离文档流，不占据页面空间，其他未浮动元素要上前补位
2、浮动元素会停靠在父元素的左边或右边，或平级的其他已浮动元素的边缘上
3、浮动元素依然位于包含框之内
4、浮动定位解决的问题-让多个块级元素在一行内显示
2、属性
属性：float
取值：
1、none
默认值，无浮动定位
2、left
左浮动，让元素停靠在父元素的左边，或紧挨着左侧已有的浮动元素
3、right
右浮动，让元素停靠在父元素的右边，或紧挨着右侧已有的浮动元素
5、浮动引发的特殊效果
1、当父元素的宽度已显示不下所有的已浮动子元素时，那么最后一个子元素将换行显示
2、元素一旦浮动起来之后，元素的宽度将变成自适应(内容决定宽度)，前提：不指定元素宽度的情况下
3、元素一旦浮动起来之后，都将变成块级元素，尤其对行内元素影响较大
块级元素：允许修改尺寸
行内元素：不允许修改尺寸
4、文本，行内元素，行内块元素时采用环绕的方式来排列的，是不会被浮动元素压在底下的。
6、清除浮动影响
属性：clear
取值：
1、none
默认值，不做任何清除操作
2、left
清除该元素左边(上边)的浮动元素所带来的影响
3、right
清除该元素右边的浮动元素所带来的影响
4、both
清除该元素两边的浮动元素所带来的影响
7、浮动元素对父元素所带来的影响
由于浮动元素脱离文档流，所以不占据父元素空间。如果一个元素中所有的子元素全部都浮动了的话，那么该元素的高度将变成0
解决方案：
1、直接设置父元素高度
弊端：必须要知道父元素高度是多少
2、设置父元素也浮动
弊端：对后续元素会带来位置的影响
3、为父元素设置 overflow 属性
取值：hidden 或 auto
弊端：如果有内容要以溢出的方式显示的话，也一同被隐藏了。
4、在父元素中，追加空子级块级元素，并设置其clear属性值为 both
4971
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
