第五章

Posted 2020-11-02 ww张炜啊

CSS3美化网页元素

1.编辑网页文本
有文字、图片、功能：向用户传递信息，通过ＣＳＳ对网页进行排版（行高＼文字＼图片对齐方式）
2.文本在网页中的意义
①有效传递网页信息
②使用CSS样式美化过的网页文本,是页面更漂亮
③
3.<span>标签
4.字体样式
属性 含义 举例
font-family 设置字体类型 font-family:"宋体"
font-size 设置字体大小 font-size:12px
em
rem
cm
mm
pt
pc
font-style 设置字体风格 font-style
italice 斜体
oblique 倾斜提
normal 正常
inherit
font-weight 设置字体粗细 font-weight
normal 默认字体,标准字体
bold 加粗
bolder 更粗
lighter 更细
100、200 400=normal 700=bold

font属性
字体属性顺序：字体风格→字体粗细→字体大小→字体类型
font：intalic bold 30px "宋体";
4.文本样式
属性 含义 举例
color 颜色 color:
text-align 水平对齐方式 text-
text-indent 首行文本缩进
line-height 文本的行高
text-decoration 装饰文本
5.color属性
十六进制表示颜色

 

第五章
1. <span>标签:
它没有固定的格式表示,只有对它应用CSS样式时,它才会发生视觉上的变化。

2.字体样式:
常用字体属性:
(1)font-family设置字体类型font-family:"宋体";
(2)font-size设置字体大小font-size:12px;
(3)font-style设置字体风格font-style: ;
(4)font-weight设置字体粗细font-weight: ;
属性:
①normal默认字体,定义标准的字体
②bold粗体字体
③bolder更粗的字体
④lighter更细的字体
3.文本属性:
(1)color设置文本颜色
(2)text-align设置元素水平对齐方式
①left把文本排列到左←
②right把文本排列到右
③center把文本排列到中间
④justify设置两端对齐文本效果
(3)text-indent设置首行文本的缩进 ,垂直对齐方式中使用vertical-align:middle;
(4)line-height设置文本的行高
(5)text-decoration设置文本的装饰
①none默认值,定义的标准文本
②underline设置文本的下划线
③overline设置文本的上划线
④line-through设置文本的删除线
⑤blink设置文本闪烁,只在Firefox浏览器中有效果

4.超链接伪类
(1)a:link未单击访问时超链接样式
(2)a:hover鼠标悬浮其上的超链接样式
(3)a:active鼠标 未释放的超链接样式
(4)a:visitad单击访问后超链接样式

5.cursor属性常用值
(1)default默认光标
(2)pointer超链接的指针
(3)wait显示程序正在忙
(4)help指示可用的帮助
(5)text指示文本
(6)crosshair鼠标呈现十字状

6.背景属性
(1)background-color背景颜色