【DIV+CSS入门教程】四、CSS如何控制页面
本节主要讲解，两个内容，
第一：CSS
如何控制页面样式，有
几种方式；
第二：这些方式出现在同一个页面时的优先级。
使用xHTML
+CSS
布局页面，其中有个很重要的特点就是内容与表象相分离，内容指HTML页面代码，表象就是CSS代码了，如果把页面看成穿着衣服的人的话，人就是
HTML，是内容，而衣服呢就是CSS，是表
象，现在出现的问题是，如何让CSS去控制页面？或者说，如何让衣服穿在人身上，好体现出人得风格特
点；不同的CSS就可以使页面出现不同的风格适用不同的网站，而不同的衣服，人穿上后就会体现
出不同的职业。
第一：如何让CSS去控制HTML页面效果呢？
有
这么4种方式，行内方式、内嵌方式、链接方式、导入方式
1）行内方式
行内方式是4种样式中最直接最简单的一种，直接对HTML标签适用style=""，例如：
<p style="color:#F00; background:#CCC;
font-size:12px;"></p>
虽然这种方法比较直接，在制作页面的时候需要为很多的标签设置style属性，所以会导致HTML页面不够纯净，文件体积过大，不利于搜索蜘蛛爬行，从而
导致后期维护成本高。
2）内嵌方式
内嵌方式就是将CSS代码写在<head></head>之间，并且用<style><
/style>进行声明，例如：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
#div1{width:64px; height:64px; float:left;}
#div1 img{width:64px; height:64px;}
-->
</style>
</head>
<body>
<div id="div1"><img
src="http://www.cssxuexi.cn/index/images/ico/2days.gif"
/></div>
全国的CSS爱好者汇聚于此，如果不来，你就OUT喽~我们的口号是：
“分享自己的欢乐与痛苦，分享自己的经验与心得，分享自己的资料与资源”
如果您也愿意，就加入我们吧~
</bo
相关文档：
比如要分辨IE6和firefox两种浏览器，可以这样写：
<style>
div{
background:green; /* for firefox */
*background:red; /* for IE6 */
}
</style>
我在IE6中看到是红色的，在firefox中看到是绿色的。
解释一下：
上面的css在firefox中，它是认识不了后面的那个� ......
四个css工具：fonts,grids,reset,base
使元素标准化的reset.css
以下普通而常用的元素都将margin和padding值标准化到0
the document body
div and p
所有list 元素：dl,dt,dd,ul,ol,li
标题级元素：h1,h2,h3,h4,h5,h6
pre和blockquote元素
某些表单元素：form,fieldset,input,textarea
table元素：t ......
简介
什么是CSS hack(http://www.cssplay.org.cn/css-hack/index.html)由于不同的浏览器，比如Internet Explorer 6,Internet Explorer 7,Mozilla Firefox等，对CSS的解析认识不一样，因此会导致生成的页面效果不一样，得不到我们所需要的页面效果。
这个时候我们就需要针对不同的浏览器 ......
Eric Meyer’s CSS Reset
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, fo ......
