网页设计,网页编辑和超级链接(css)

《网页设计,网页编辑和超级链接(css)》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第三章网页编辑（样式表）和超级链接统一网站风格、制作基本特效CSS样式表2主要内容一、样式表(CSS)的基本概念二、CSS与HTML文档的结合方法三、CSS属性的理解与应用四、CSS样式的单位五、CSS样式在网页中的应用六、插入文本七、插入对象八、超级链接1关于层叠样式表通常情况下我们希望将页面显示内容与显示方式分开，使得内容编辑人员的工作重心放在网站内容的撰写上，而站点的美工和界面设计人员的工作重心放在页面显示的风格和样式上。样式是预先定义好的、格式化文档的工具。CSS全称CascadingStylesSheet，译为层叠

2、样式表，是由W3C（WorldWideWebConsortium）组织所拟定的。一、CSS的基本概念1关于层叠样式表(续)CSS（CascadingStyleSheets）是开放性样式设定语句，它扩充了HTML标记的属性设定，这些属性设定可以通过脚本语言进行控制，使网页的视觉效果更加丰富多彩。CSS将页面的样式与显示内容的文档分开，可以高效、统一地组织页面元素。对于具有相同风格多个页面的站点来说，只需要建立定义样式的CSS文件，并使需要使用这些样式的文档调用相应的样式文件即可。当网站的风格需要更新时，只要更改CSS样式文件即可。

3、CSS技术的应用使得网站的开发、管理和维护大为简化，提高了开发效率。一、CSS的基本概念（1）样式表的版本：1996年，W3C推出CSS1。1998年中期，W3C公布CSS2。目前，W3C正在开发CSS3。IE6与NS7已经实现了CSS1中的绝大部分特性，但并没有实现全部特性；IE8的最新版本支持CSS2。本章介绍的属性可以被至少其中一种浏览器所支持（2）样式表的层次：样式表称为层叠样式表是因为它们可以以三层的形式定义，以此指定文档的样式；较低层的样式表能够覆盖较高层的样式表。CSS的三个层次，按照从底层到高层的顺序，分别为行内

4、样式表、文档层样式表和外部样式表，其中行内样式表只能作用于单个标签的内容；文档层样式表则能够对文档的整个主体起作用，而外部样式表可以应用到任意数目文档的主体中。如果浏览器无法满足样式表指定的属性，则浏览器或者采用另一个值代替此值或者忽略这个给定值。CSS样式表7一、CSS的基本概念2、编写CSS样式的方法使用CSS编辑器如Dreamweaver、Frontpage等都会自带CSS编辑器。使用超文本编辑器如Dreamweaver、Frontpage等超文本编辑器均可编辑样式表；记事本CSS样式表8一、CSS的基本概念3、基

5、本语法选择符{属性:值}选择符{属性1:值1;属性2:值2;……}单一选择符的复合样式声明应该用“;”隔开，为便于阅读也可以分行写。几乎所有的HTML标记符形式都可以作为选择符。H1{font-size:x-large;color:red}H2{font-size:large;color:blue}H1{font-size:x-large;color:red}H2{font-size:large;colo

6、r:blue}CSS样式表9一、CSS的基本概念4、CSS样式的组合、继承和关联性样式的组合：把具有相同声明定义的选择符组合在一起，并用逗号隔开。－例如：段落元素p、单元格元素td和类c1可以使用相同样式：p,td,.c1{font-size:12pt;font-family:黑体;color:red}CSS样式表10一、CSS的基本概念样式的继承：若子元素未定义，则它将继承上级元素的样式的定义。但存在少数属性不能继承（border）。CSS样式表11一、CSS的基本概念样式表的关联性：样式表的关联性指在某些样式定义中，可以定义某样式仅在某个特定元素范围内才有效。。例如：pb{font-size:12pt;font-family:黑体;color:red}b元素仅在p元素作用范围内会套用上述的样式设定。而在其他地方不具有这些属性。CSS样式表12一、CSS

8、的基本概念5、注释CSS文字的注释形式与C语言类似。p{font-size:12pt}/*P标签的样式定义*/CSS样式表13一、CSS的基本概念6、选择符样式表的基本语法形式：selector{property1:value1;property2:valu