CSS布局教程

在开始CSS布局之前，有必要认识一个重要标签--DIV
DIV是什么
DIV与其他XHTML标签一样是一个XHTML所支持的标签，如当使用一个表格时候，应用<TABLE></TABLE>这样的结构一样，DIV在使用的时候也是以<DIV></DIV>这样的形式出现，DIV是一个容器，我们知道，XHTML页面中的每一个标签对象几乎都可以称得上是一个容器，如使用H1标题对象
<H1>天津网站优化</h1>
...

css编码可以以多种方式灵活的应用到我们所涉及的xhtml中，选择方式根据我们对于设计的不同的要求来制作
行间样式表
行间样式表是指将css样式编码写在xhtml标签之中，类似于如下格式
<h1 style="font-size:12px;color:#000000;font-weight:normal">天津网站优化</h1>
...

通配选择符
如果接触过dos命令或是word中替换功能，对于通配操作应用应该不会陌生，通配是指示用字符替代不确定的字，如在dos命令中，使用*.*表示所有文件，使用*.bat表示所有扩展名为bat的文件，因此，所谓通配选择符，也是指我们对对象可以使用模糊的指定的方式进行选择，css的通配符使用*作为关键字，使用方法如下
*{color:blue;}
*号使用表示所有对象，包含所有不同id不同class的xhtml的所有标签，使用如上的选择符进行样式定义，页面中所有对象都会使用color:blue;的字体颜色
...

标签指定式选择符
如果即想使用id或class,也想同时使用标签选择符，可以使用如下格式
h1#content{}
表示针对所有id为content的h1标签
h1.p1{}
表示针对所有class为p1的h1标签
标签指定式选择符在对选择符选择的精确度上介于标签选择符及id,class选择符之间，也是一种经常能够使用到的选择符形式
组合选择符
对于上述所有css选择符而言，无论是什么样的选择符，均可以进行组合使用
...

id选择符及class 选择符均是css提供的由用户自定义标签名称的一种选择符模式，用户可以使用id及class对页面的xhtml标签进行自定义名称，从而达到xhtml标签及组合xhtml标签的目的，比如对于xhtml中的h1标签而言，对于css，如果使用id进行选择符，那么<h1 id="p1">及<h1 id="p2">对于css来讲是两个不同的元素，从而达到扩展的目的，用户定义名称的方式也有助于用户细化自身的界面结构，使用符合页面需求的名称来进行结构设计，增强代码可读性。
...

css的语法结构仅仅由三部分组成，选择符，属性和值
使用方法：
选择符：指这组样式编码所要针对的对象，可以使一个xhtml标签如bodu,h1也可以使定义了特定id或class的标签，如#main选择表示选择<div id="main">即一个被指定了main为id的对象，浏览器将对css选择符进行严格的解析，每一组样式均会被浏览器应用到对应的对象上
属性是css样式控制的核心，对于每一个xhtml中的标签，css都提供了丰富的样式属性如颜色，大小，定位，浮动方式等。
...

天下星既然是xhtml，当然与xhtml有一定的区别，其中最明显的一点就是，xhtml语法要求上更加严格，因此开始编写xhtml时候，一定要严格符合xhtml的语法规范，而这些新规则主要表现在以下几个方面
属性名称必须小写
在标签中编写属性，必须使用小写，正确的写法是：
<span class+"blue">天津网站优化</span>
...

天下星有个标签，就有了包含内容的页面对象，但css如何控制这些对象呢？这时候就需要使用xhtml中的id和class 属性，xhtml中的任何一个对象，都可以设置id或class属性，id与class都用于标示一个对象，如<p id="content">天津网站优化</p>
...

选择合适的标签

在使用表格式布局的时期，设计师几乎只认识table标签，而在xhtml编码之中，就有必要使用更多的标签来组织内容了，表格式布局之中，所有样式都由表格替代，无论是标题还是列表，都使用表格中的单元格组合来实现，这样做使得网页代码变得混乱，可读性差，也不利于修改，xhtml 标记最终目的是给内容定义结构，浏览器通过解析标签把页面内容按结构展现出来，因此对于每个元素，都可以选择适合这个元素的标签进行编码

布局

div标签是布局用的标签的首选，页面中的每个区域，如页头，页脚，左分栏，右分栏都可以使用div进行表示，例如：
...

一个标准的xhtml文档必须以doctype标签作为开始，doctype标签用于定义文档的类型，对于xhtml而言，类型可以使用3种不同的xhtml文档类型，使用方式如下：
transitional类型 xhtml文档类型的一种，是一种过渡类型，使用过度类型的xhtml网页，浏览器xhtml的解析较宽松，允许使用html4.01中的标签，但必须符合xhtml的语法。
strict类型：严格类型，使用此类型的网页，浏览器解析将相对严格，不允许使用任何表现样式的表示和属性，如在元素中直接使用bgcolor背景色属性。
...