1.opacity属性指定元素的不透明度/透明度,取值范围0.0 - 1.0 .值越低,越透明
div{
background-color:green;
opacity:0.3a
}
2.background-image属性指定元素背景的图像
body{
background-image:url(“demo.gif”)/** background-image:url(“demo.png”) **/
}
默认情况下,其在水平和垂直方向上都重复图像
仅在水平方向重复:background-repeat: repeat-x;
仅在垂直方向重复:background-repeat: repeat-y;
只显示一次背景图像:background-repeat:no-repeat;
3.background-attachment属性指定背景图像应该是滚动还是固定(不会随其他页面内容一起滚动)
body{
background-image: url("tree.png"); background-repeat: no-repeat; background-position: right top; background-attachment: fixed; / ** 固定图像 **/ background-attachment: scroll;/ ** 随页面其余部分一起滚动 **/
}
4.简写属性background
background:#ffffff url("demo.png") no-repeat right top;
顺序是:①background-color②background-image③background-repeat④background-attachment⑤background-position
5.border-style边框属性
dotted
- 定义点线边框dashed
- 定义虚线边框solid
- 定义实线边框double
- 定义双边框groove
- 定义 3D 坡口边框。效果取决于 border-color 值ridge
- 定义 3D 脊线边框。效果取决于 border-color 值inset
- 定义 3D inset 边框。效果取决于 border-color 值outset
- 定义 3D outset 边框。效果取决于 border-color 值none
- 定义无边框hidden
- 定义隐藏边框
6.外边距合并
外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。
注意:只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。
7.内边距box-sizing:border-box属性
div{ width:300px; padding:25px; }
实际宽度为350px,若保持300px不变,则加上border-box,会导致可用宽度减少
8.max-width元素最大宽度
它和普通width区别是,适配浏览器宽度,也就是说当浏览器窗口宽度小于宽度时候,普通width的会出现左右滑动滚轮,而max-width最大宽度不会。
9.outline轮廓
outline-style
outline-color
outline-width
outline-offset
outline
注意:轮廓与边框不同!不同之处在于:轮廓是在元素边框之外绘制的,并且可能与其他内容重叠。同样,轮廓也不是元素尺寸的一部分;元素的总宽度和高度不受轮廓线宽度的影响。
9.text-decoration用于设置或删除文本装饰
text-decoration:none取消删除下划线
10.text-transform指定文本中大小写
11.text-文本间距
text-indent第一行文本缩进
word-spacing单词间距
white-space空白,white-space: nowrap;禁止文本换行
text-overflow:指定应如何向用户示意未显示的溢出内容