文档介绍:第6章 CSS样式表基础
Web标准的基本组成
XHTML的基本知识
CSS编写基本模式
CSS的基本语法
本章主要内容:
《网页设计制作基础与上机指导——HTML+CSS+JavaScript》清华大学出版社
Web标准
Web标准不是某一个标准,而是一系列标准的集合,用户只有在了解了其概念之后,网页制作才能做到有的放矢,在全局上把握各种技术。
Web标准的基本组成
Web标准是很多网站表现层技术标准的集合,由著名的W3C组织制定。所谓表现层技术,即网页前台技术,包括HTML、XHTML、CSS、JavaScript等。有了统一的标准,才能保持技术的稳定发展,使网页表现技术层能在任何设备中正常浏览。
网页主要由三部分组成,即结构(Structure)、表现(Presentation)和行为(Behavior),因此对应的语言标准也分3方面:
(1)结构标准语言:主要包括XHTML和XML。
(2)表现标准语言:主要包括CSS。
(3)行为标准:主要包括对象模型及ECMAScript。
建立Web标准的目的与好处
传统的网页布局(使用table进行布局)已经有很长的历史和比较成熟的技术规范了。但是仍然存在一些缺点。由于页面的内容和修饰没有分离,导致修改的困难,由于页面代码的语义不明确,导致数据利用的困难。而使用CSS进行网页布局,分离了结构和表现,上述的问题也就迎刃而解了。
1. 建立Web标准的目的
建立Web标准的目的是解决网站中由于浏览器升级、网站代码冗余、臃肿等带来的问题。
2. 使用Web标准的好处
使用Web标准最大的好处就是大大缩减了页面代码,提高了浏览速度,缩减了宽待成本。由于结构清晰,能使网页更容易被搜索引擎搜索到。
Web标准与浏览器的兼容性
W3C对标准的推进,Firefox,Chrome,Safari,Opera的出现,结束了IE雄霸天下的日子。然而这对开发者来说,是好事,也是坏事。说它是好事,是因为浏览器厂商为了取得更多的市场份额,会促使各浏览器更符合W3C标准,而得到更好的兼容性,并且不同浏览器的扩展功能对W3C标准也是个推进;说它是坏事,是因为多个浏览器同时存在,这些浏览器在处理一个相同的页面时,表现有时会有差异。这种差异可能很小,甚至不会被注意到;也可能很大,甚至造成在某个浏览器下无法正常浏览。一般把引起这些差异的问题统称为“浏览器兼容性问题”。
从浏览器内核的角度来看,浏览器兼容性问题可分为以下3类:
(1)渲染相关:和样式相关的问题,即体现在布局效果上的问题。
(2)脚本相关:和脚本相关的问题,包括JavaScript和DOM等方面的问题。对于某些浏览器的功能方面的特性,也属于这一类。
(3)其他类别:除以上两类问题外的功能性问题,一般是浏览器自身提供的功能,在内核层之上的。
Web标准与浏览器的兼容性
XHTML与CSS
2000年底,国际W3C组织公布发行了XHTML ,这是一种在HTML ,目的是基于XML应用。XHTML是一种增强了的HTML,它的可扩展性和灵活性将适应未来网络应用更多的需求。由于HTML结构混乱,条理不清晰,样式与结构没有分离,所以符合Web标准的网页结构推荐使用XHTML。
XHTML是HTML的升级版,侧重点在于对网页的结构设计,其语法严谨,有语义,而且页面的样式部分即表现部分由CSS负责。
XHTML的基本知识
XHTML的基本知识
与HTML相比XHTML主要有以下特点:
(1)XHTML解决了HTML语言所存在的严重制约其发展的问题。
(2)XML是Web发展的趋势,所以人们急切的希望加入XML的潮流中。
(3)使用XHTML的另一个优势是它非常严密。
(4)XHTML能与其它基于XML的标记语言、应用程序及协议进行良好的交互工作。
(5)XHTML是Web标准家族的一部分,能很好在无线设备等其它用户代理上。
(6)在网站设计方面,XHTML可助设计者去掉表现层代码的恶校验来测试页面工作的习惯
XHTML中的元素
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Transitional//EN" "/xhtml1/DTD/xhtml1-"><html xmlns="9/xhtml">
XHTML的相应代码为:
1)文档结构
XHTML的文档结构和HTML是一样的,定义文档开始和结束时使用HTML元素。页面同样分为head和body两部分,其中head部分的内容是不显示在页面