HTML5知识点5
1.< span>标签
< span>标签是HTML5的行内标签,被用来组合文档中的行内元素。
1.1 字体样式
font-family:字体类型
语法:
p{font-family:"黑体"}
font-size:字体大小
p{font-size:23px}
font-style:字体风格
属性如下:
mormal:默认值,浏览器会显示标准的字体样式
italic:浏览器会显示倾斜的字体样式
obliue:浏览器会显示倾斜的字体样式
p{font-style:normal}
font-weight:字体粗细
属性如下:
normal:默认值,定义标准的字符
bold:粗细字符
bolder:更粗的字符
lighter:更细的字符
p{font-weight:nomral}
font:字体样式进行设置
1.2 文本样式
color:文本颜色
text-align:文本内容的水平对齐方式
text-indent:首行文本的缩进
text-height;文本的行高
text-decoration:文本的装饰
vertical-align:文本内容的垂直对齐方式
text-shadow:设置文本阴影效果
2.超链接伪类和列表样式
2.1超链接伪类
属性如下:
a:link{CSS样式规则}:未访问超链接的状态
a:visited{CSS样式规则}:单击访问后超链接的状态
a:hover{CSS样式规则}:鼠标悬停时超链接的状态
a:active{CSS样式规则}:鼠标未释放时超链接的状态
2.2 列表样式
常见的属性:
list-style-type:列表标记的类型
list-style-image:使用图片替换列表的标记
list-style-position:在任处放置列表项的标记
list-style:所有的列表属性
3.背景样式
背景样式在网页中无处不在,它可以给用户带来的视觉感受,以及良好的用户体验。
3.1< div>标签
< div>标签是设置背景的标签
3.2背景属性
background-color:规则要使用的标记颜色
background-image:规则要使用的背景图像
background-repest:规定如何重复背景图像
background-position:背景图像的位置
background-size:背景图像的尺寸
3.3CSS3渐变
1.CSS渐变属性对浏览器的兼容性
2.CSS的线性渐变的使用
3.4CSS渐变方向
方向 | 描述 |
---|---|
to top | 第一种颜色向第二种颜色渐变的方向是从底部到顶部 |
to bottom | 第一种颜色向第二种颜色渐变的方向是从顶部到底部 |
to left | 第一种颜色向第二种颜色渐变的方向是从右边到左边 |
to top | 第一种颜色向第二种颜色渐变的方向是从左边到右边 |
to top | 第一种颜色向第二种颜色渐变的方向是从右下方到左上方 |
to top | 第一种颜色向第二种颜色渐变的方向是从左上方到右上方 |
to top | 第一种颜色向第二种颜色渐变的方向是从右上方到左下方 |
to top | 第一种颜色向第二种颜色渐变的方向是从左上方到右下方 |