(x)html与css概述

《(x)html与css概述》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、网页制作综合技术教程第3部分CSS样式设计第8章(X)HTML与CSS概述HTML与XHTML8.1(X)HTML与CSS8.2构造CSS规则8.3基本CSS选择器8.4在HTML中使用CSS的方法8.5通过前面的学习，我们已经理解了HTML的核心原理。实际上使用HTML非常简单，其核心思想就是需要设置什么样式，就使用相应的HTML标记或者属性。在前文中，初步地分析了由于历史原因和HTML自身的局限性，所带来的一些问题。为了解决这些问题，HTML逐步地发展到了XHTML，而XHTML也更加便于和CSS相配合。本章将着重介绍HTML、XHTML和CSS三者之间的关系，重点

2、是理解使用CSS的核心目的。8.1HTML与XHTML8.1.1追根溯源从HTML到XHTML，大致经历了以下版本。●HTML2.0：1995年11月发布。●HTML3.2：1996年1月14日发布。●HTML7.0：1997年12月18日发布。●HTML7.01（微小改进）：1999年12月24日发布。●XHTML1.0：2000年1月发布，后又经过修订于2002年8月1日重新发布。●XHTML1.1：2001年5月31日发布。●XHTML2.0：正在制订中。8.1.2DOCTYPE的含义与选择8.1.3XHTML与HTML的重要区别1．在XHTML中标记名称必须小写

3、2．在XHTML中属性名称必须小写3．在XHTML中标记必须严格嵌套4．在XHTML中标记必须封闭5．在XHTML中即使是空元素的标记也必须封闭6．在XHTML中属性值用双引号括起来7．在XHTML中属性值必须使用完整形式8.2(X)HTML与CSS8.2.1CSS标准8.2.2传统HTML的缺点其实传统HTML的缺陷远不止上例中所反映的这一个方面，相比CSS为基础的页面设计方法，其所体现出的劣势主要有以下几点。（1）维护困难。为了修改某个特殊标记（如上例中的

标记）的格式，需要花费很多的时间，尤其对于整个网站而言，后期修改和维护的成本很高。（2）标记不足。HTM

4、L本身的标记很少，很多标记都是为网页内容服务的，而对于美工样式的标记，如文字间距、段落缩进等标记在HTML中很难找到。（3）网页过“胖”。由于没有统一对各种风格样式进行控制，因此HTML的页面往往体积过大，占用网络带宽。（4）定位困难。在整体布局页面时，HTML对于各个模块的位置调整显得捉襟见肘，过多的其他标记同样也导致页面的复杂和后期维护的困难。8.2.3CSS的引入8.2.4如何编辑CSS图8.4Dreamweaver的代码模式图8.5Dreamweaver语法提示图8.6调色板8.2.5浏览器与CSS图8.7IE浏览器和Firefox浏览器的标志图8.8IE与Fi

5、refox的效果区别8.3构造CSS规则在具体使用CSS之前，请看一个生活中的例子，通常我们描述一个人可以为这个人列一张表：张飞{身高：185cm；体重：105kg；性别：男；性格：暴躁；民族：汉族；}2级标题{字体：宋体；大小：15像素；颜色：红色；装饰：下划线}h2{font-family:宋体;font-size:15px;color:red;text-decoration:underline;}CSS的思想就是首先指定对什么“对象”进行设置，然后指定对该对象的哪个方面的“属性”进行设置，最后给出该设置的“值”。因此，概括来说，CSS就是由3个基本部分组成的——“

6、对象”、“属性”和“值”。8.4基本CSS选择器在CSS的3个组成部分中，“对象”是很重要的，它指定了对哪些网页元素进行设置，因此，它有一个专门的名称——选择器（selector）。8.4.1标记选择器图8.9CSS标记选择器8.4.2类别选择器图8.10类别选择器8.4.3ID选择器图8.14ID选择器8.5在HTML中使用CSS的方法8.5.1行内式8.5.2内嵌式8.5.3链接式8.5.4导入式8.5.5各种方式的优先级问题