资源简介 课件27张PPT。第11课 最佳搭档——应用CSS样式与层美化网页CSS的基本概念CSS(Cascading Style Sheets),层叠样式表单。新建CSS样式外部样式指将样式表作为一个独立的文件保存在计算机上,这个文件以“.css”作为文件的扩展名。然后在源代码中以link方式链接。它的好处是不但本页可以调用,其它页面也可以调用,是最常用的一种形式。 内部样式 这种形式是内部样式表,它是以结尾,写在源代码的head标签内。这样的样式表只能针对本页有效。不能作用于其它页面。新建CSS样式2.CSS样式基本语法CSS的基本语法由三部分构成:选择器(Selector)、属性(Property)和属性值(Value)三个部分。定义样式:.title01 { font-size: 18px; text-decoration: underline;}调用样式:6.设置CSS样式7.将CSS应用到网页设置CSS样式规则全部以“类”为例;注意知识点。(1)设置文本样式在【CSS规则定义】对话框的【分类】区域,选择【类型】选项,可以对文本的样式进行设置。字体字号字体粗细字体样式行高大小写调整*首字母大小写调整*字体颜色修饰(2)设置背景样式背景颜色背景图片背景重复背景固定/滚动背景水平位置背景垂直位置(3)设置区块样式单词间距字母间距垂直对齐*文本对齐文字缩进空格*显示*课堂练习1(4)设置方框样式宽度高度浮动清除*填充边界DIV传统的表格排版是通过大小不一的表格和表格嵌套来定位排版网页内容。改用CSS排版后,就是通过由CSS定义的大小不一的盒子和盒子嵌套来编排网页。知识点:新建DIV(4)设置方框样式宽度高度浮动清除浮动填充边界(5)设置边框样式块级元素和内联元素块级元素:就是一个方块。每个块级元素都是从一个新行开始显示,而且其后的元素也需另起一行进行显示。内联元素:又叫行内元素,顾名思义,只能放在行内,就像一个单词,不会造成前后换行,起辅助作用。块级元素:段落、标题...、列表, 、表格、DIV等元素。内联元素:超级链接、图像、等元素。课堂练习2知识点:新建DIV;理解Float属性;设计多种边框。(6)设置列表样式项目符号和编号的外观项目符号图像位置项目列表和编号列表项目列表 首页 公司简介 产品介绍 留言板编号列表 首页 公司简介 产品介绍 留言板课堂练习3(6)设置列表样式哪些地方可以用列表做?(7)设置定位样式*(8)扩展样式*超链接课堂练习4-1改变超链接默认样式;在同一页面设置多个链接样式;课堂练习4-2建立项目列表生成超链接设置样式设置中的样式设置鼠标移动到的样式(:hover)知识点:复合内容float 展开更多...... 收起↑ 资源预览