《网页设计与制作》第8章.pptxVIP

《网页设计与制作》主讲人：XXX邮箱：XXXXXXXXXXX电话：XXXXXXXXXXXX

每讲一语Don’tbeafraidtotakerisks.Onlybytakingriskscanwelearnhowtobebrave不要害怕遭遇风险，只有通过冒险,我们才能学会如何变的勇敢

书本内容引导解读

（重点）学习目标第8章CSS美化属性一、CSS美化文本二、CSS美化图片与背景三、CSS美化超链接与列表四、CSS美化表格与表单

（重点）8.1CSS美化文本8.1.1CSS美化文字8.1.2CSS美化段落

（重点）8.1.1CSS美化文字属性描述font控制字体的综合属性font-size控制字体的大小属性font-family控制字体的字体属性font-style控制字体的样式属性font-weight控制字体的粗细属性font-variant控制字体的字母大小写变体属性color控制字体的颜色属性CSS美化文字属性

（重点）（1）综合属性：font选择器{font:font-stylefont-variantfont-weightfont-sizefont-family;}font属性用于对于文字样式进行综合设置，其基本语法格式如下所示。（2）大小属性：font-sizefont-size属性用于设置字号，可以通过像素值、百分比和倍数来定义字体的大小，也可以理解为通过长度（length）和其单位进行定义字体的大小，比如p{font-size:12px;}，12为长度，px为单位，表示像素，即就是表示段落里的字体大小为12像素。

（重点）（3）字体属性：font-familyfont-family属性用于设置字体，网页中常用的字体有宋体、仿宋、黑体等，基本都是中文，很少用属性里提示的英文。如果设置了，则要注意英文在前面。（4）样式属性：font-style属性值描述normal默认值，浏览器显示标准样式italic浏览器显示斜体样式oblique浏览器显示倾斜样式inherit浏览器显示从父元素继承的字体样式font-style属性用于设置字体风格，显示不一样的字体样式，也是为了突出内容的重要性。font-style属性有多个属性值，具体如表所示。

（重点）（5）粗细属性：font-weightfont-weight属性用于设置字体粗细，其属性值有13个，具体如表所示。（6）大小写属性：font-variantfont-variant属性用于设置所有小写字母转换成大写字母的字体显示文本，其属性值有两个：一个是normal值，为默认值，一个是small-caps值小写字母转换成大写字母，转换之后的大写字母与其余文本相比，字体尺寸更小。属性值描述normal默认值，浏览器显示标准样式bold定义字体加粗bolder定义字体加粗lighter定义字体变细100~900（9个值，100的整数倍）定义由细到粗的字符。其中400等同于normal，700等同于bold，数值越大越粗

（重点）（7）颜色属性：color无论是在HTML中还是在CSS中，都是用color来定义文字的颜色，并且属性值和单位都是一样的，只是属性和属性值放置的位置不一样。常用的都是颜色英文单词、十六进制颜色值和RGB颜色值三种。1)颜色英文单词：red、green、blue、gray等2)十六进制颜色值：#CCC、#0FF、#00F等3）RGB颜色值：rgb(2552300)

（重点）8.1.2CSS美化段落属性描述属性值word-wrap强制换行属性normal（正常）和break-word（强制）letter-spacing字符间距属性normal（正常）和length(长度)word-spacing单词间距属性normal（正常）和length(长度）line-height行间距属性normal（正常）和length(长度）text-decoration文字修饰属性none(去掉)、underline(下画线)、overline（上画线）、line-through（删除线）text-align文字位置属性居左（left）（默认值）、居中（center）、居右（right）white-space空白符处理normal（正常）、pre（保留）、nowrap（不会）、pre-wrap（正常换行、保留）、pre-line（合并、保留）text-shadow文字阴影h-space（水平）、v-space（垂直）、blur（模糊）、color（颜色）text-indent首行缩进默认2个字符和length(长度）CSS美化段落属性

（重点）8.