CSS属性汇编.ppt

课堂实训5-4 利用圆角框设计栏目标题 利用圆角框设计栏目标题 技能分析 实训目的 实训步骤 实训提高 实训内容 1 2 3 4 5 利用圆角框设计栏目标题 课堂实训5-4 利用圆角框设计栏目标题 课堂实训5-4 利用圆角框设计栏目标题 5.3 页面背景样式 5.3.1背景色 在XHTML中，设置网页的背景颜色利用的是body标签中的bgcolor属性，而在CSS中不但可以设置网页的背景颜色，还可以设置文字的背景颜色。 在CSS中，网页标签的背景颜色使用background-color属性来设置，属性值为某种颜色。 5.3 页面背景样式 5.3.2背景图像和布局 1.设置背景图像 背景不仅可以设置为某种颜色，在CSS中还可以用图像作为网页标签的背景，而且用途极为广泛。设置背景图像，可以使用background-image属性实现。 5.3 页面背景样式 2.设置背景图像布局 上面提到在默认情况下，图像会自动向水平和竖直两个方向平铺。如果不希望平铺或者只希望沿着一个方向平铺，可以使用background-repeat属性来控制。该属性可以设置为以下4种之一。 repeat Repeat-x No-repeat Repeat-y 5.3 页面背景样式 课堂实训5-5制作“夏威夷海滩”网页 制作“夏威夷海滩”网页 技能分析 实训目的 实训步骤 实训提高 实训内容 1 2 3 4 5 制作“夏威夷海滩”网页 课堂实训5-5制作“夏威夷海滩”网页 5.4实战训练：制作JOB FINDING工作网 5.4实战训练：制作JOB FINDING工作网 任务分析 技术难点提示 任务提示 步骤提示 5.5 思考与练习 1.简述border:none以及border:0的区别，并给出使用建议。 2.XHTML和CSS分别如何注释？ 3.简述span标签和div标签的区别与用法，并分别写出一个例子。 思考与练习 目录 目录 第5章 文字与图像 掌握文字与图像标签的使用方法。 能利用CSS属性设置文字及图像的背景、显示颜色、大小及添加特殊效果。 能灵活运用各种属性的设置完成简单的图文混排效果。 学习目标 5.1 文 字 样 式 5.1.1字体属性 CSS中用于控制字体的常用属性如表5-1所列。 5.1 文 字 样 式 1.font-family属性 5.1 文 字 样 式 1.font-family属性 5.1 文 字 样 式 2.font-size属性 相对大小 关键字大小 绝对大小 5.1 文 字 样 式 3.font-weight属性 Font-weight属性用来控制字体的粗细，支持的属性值有normal、bold、bolder、lighter、100、200、300、400、500、600、700、800、900，其中最常用的是normal和bold。 5.1 文 字 样 式 4.font-style属性 Font-style属性用于给文本添加斜体样式，共有3个有效值：normal、italic和oblique。其中，normal指的是普通样式而非斜体，italic和oblique两个值都是斜体样式，它们的区别在于，有的字体不支持italic格式，但可以使用oblique，这时浏览器会将文字倾斜显示。一般情况下，使用italic就可以了。设置font-style属性值为normal的代码如下： Font-style：normal； 5.1 文 字 样 式 5.font-variant属性 Font-variant属性有两个有效值：small-caps和normal。值为small-caps时，会把小写字母转换成小型的大写字母。当要控制字母的大小写时，一般会使用text-transform属性（后面会详细介绍），而不是font-variant属性。 5.1 文 字 样 式 6.line-height属性 Line-height属性不属于字体属性，而是用于指定文本行的高度，由于它通常会和font-size属性简写在一起，所以放在这里介绍。Line-height属性的值可以是关键字normal（默认值）、长度值或者百分比。 5.1 文 字 样 式 7.font属性 font属性用于将以上字体的多个属性缩写为一个属性，缩写时需要遵循以下规则。 （1）属性值必须按照font-style、font-variant、font-weight、font-size和font-family的顺序来书写，多个属性值之间用空格分开。 （2）font-size和font-family属性是必须有的，其他属性则是可选的。 （3）如果需要在font属性中加入line-height属性，则把它写在font-size后面，中间用“/”分开