css样式表的特征:
1.继承性:继承父元素的一些属性
2.层叠性:不同定义中不重复的属性可以层叠到一起,如果属性重复的话,后定义的为准
3.优先级:优先级和选择器的权重有关系 手动调整优先级用!important
隐藏属性:
1.display:none 包括元素在内全部隐藏 不占用空间
2.overflow:
hidden 超出它父元素的部分隐藏
scroll超出部分变为滚动条:
1.scrollbar设置滚动条的宽度
2scroll-track设置滚动条轨道的样式
3scroll-thumb设置滚动条滚动部分的元素
a标签的伪类选择器
link:更改没有访问时链接的样子
active:更改点击访问时的样式
visited:更改访问过后的样式
边框的阴影
box-shadow属性
h-shadow:水平阴影距离
v-shadow:垂直阴影距离
blur:可选 模糊距离
spread:调节阴影尺寸
color:调节阴影颜色
inset:将当前阴影改为内阴影
边框背景图片
border-image:
border-image-source : 图片路径
border-image-width:显示图片的宽度比例
border-image-repeat : 边框的平铺方式
取值 :
repeat : 平铺
round : 铺满
stretch : 拉伸
渐变
1、线性渐变:linear-gradient
2、径向渐变:radial-gradient
3、重复渐变:repeating-linear-gradient
角度 : 0deg --> to top
90deg -->to right
180deg --> to bottom
red 0% : 从开始处显示红色
green 50% : 到 50% 位置处 ,变成绿色
blue 100% : 到结尾处,变为蓝色
控制字体
font-family:改变字体
font-width:改变字体的样式
控制文本格式
1、文本颜色:color:value;
2、文字水平排列方式:text-align : left/right/center
3、文本线条修饰:text-decoration:none / underline ;
取值 : overline(上划线) , line-through(删除线)
4、行高 :每行文本所占的高度是多少。一旦设定好后,该行文本将在该行内垂直居中显示 (仅在行高大于本文大小时有效)。
5、首行文本缩进text-indent : value ;value 表示的是缩进的距离
6、文本阴影:text-shadow : h-shadow v-shadow blur color;
显示效果
1、visibility作用:实现元素可见性(显示/隐藏)
取值:
1、visible :默认值,元素可见的。
2、hidden:元素不可见,隐藏,但是空间依然占据。
3、collapse:用在表格上,可以删除一行或一列,不影响表格的布局。
2、opacity
设置元素的不透明级别
属性:opacity
取值:0-1 之间的数字(包括0 和 1)
0 :完全透明
1 : 完全不透明
取值越大,越不透明