在校学习近一年时间了，我们都学习了很多的知识，像有趣的Flash，用它可以做出动感强，画面炫丽的网页动画；“魔术师”-photoshop用它来点缀网页确实可以增彩不少，它可以将图片进行各式各样的处理，也可以将你脑海中的图像真实的表现出来(当然，你要具备PS高手级的技术)；但说到网页，那就尤为重要了。而在现在如果想要做出集功能全面、布局得当、美观等等为一体的网页的话，少了CSS是万万不行的。
CSS(Cascadding style sheet)中文翻译为“层叠样式表”，简称样式表。
CSS的定义是由三个部分构成：
选择符（selector）
属性（properties）
属性的值（value）
基本格式为：选择符{属性：值；}
CSS的应用分为三种即为：行间样式、内部样式和外部样式；
内部样式写在<head>内
<style type=“text/css”>…</style>
内部式样表与行间式样表的相似之处在于，也是将CSS式样编写在页面之中，所不同的是，可以将样式表统一放置在一个固定位置
行间样式写在<body>内
<style=“color:blue”>
行间式样表由标签的style属性支持，css代码直接写在标签内。是css样式定义的基本形式，然而我极力不推荐这种式样表编写方式。
文件外调用（后缀名为.css）
<link rel=“stylesheet”href=“style.css”type=“text/css”>
外部式样表是CSS应用中最好的一种形式.将CSS代码单独写在一个独立文件之中，由网页进行调用.多个网页可以调用同一个文件，因此能有实现代码的最大化重用‘及网站文件的最优化配置
CSS选择器分为三种：类别选择器、标签选择器和公共类选择器；
类
margin属性怎么用input{属性：值}
伪类
a:link｛属性：值｝
a:visited｛属性：值｝
a:active｛属性：值｝
a:hover｛属性：值｝
公共类
.zidingyi｛属性：值｝
注意：
1.选择公共类自定义名称必须是由字母、数字、下划线和连字符组成，并且必须是以字母开头的
2.所有的CSS的尽量采用外部调用<link href="style/style.css"
rel="stylesheet"type="text/css"/>
书写时重定义的最先，伪类其次，自定义最后（其中a:link a:visited a:hover a:actived要按照顺序写）便于自己和他人阅读。
3.多使用样式表
一个字或一类要用样式最好用样式表。这一条我也信服因为有一批文字要写样式，但是文字都分布在不同段落。要写样式很是麻烦，比如有N个字在X个位置上，其样式为字体：黑体，颜：红，字号：12px，字间距：2px，于是乎在X个位置上写下了<font face="黑体"color="red"size="12px">...</font>这样的代码可恶心了，但用了样式表的自定义类
.ziti{
font-family：黑体;
color:red;
font-size:12px;
}
这样写一次性就写好了，只要在X个位置上写下class="ziti"的代码就OK了，既省时又容易修改。
4.注意格式
这一点是从B同学哪里学来的，就是注意各个标记的层次关系，只有一个好处也是最突出最特别的有点，容易检查标记是否闭合，层级关系一目了然。例如：
<div id="div_Container"><!--页面层容器-->
<div id="div_Header"></div><!--页面头部-->
<div id="div_PageBody"><!--页面主体-->
<div id="div_Sidebar"></div><!--侧边栏-->
<div id="div_MainBody"></div><!--主体内容-->
</div>
<div id="div_Footer"></div><!--页面底部-->
</div>
5.闭合问题
在XHTML中，每一个打开的标签都必须关闭。<meta…/>、<img…/>；空标签也要关闭，在标签尾部先敲个空格再使用一个正斜杠"/"来关闭它们。例如：<br />、<hr/>
6.属性名必须小写
在XHTML中，属性必须小写。如class属性，不允许使用CLASS或Class这样的形势
7.不允许使用属性的简写
单选按钮的checked属性和option的selected属性在XHTML中不允许使用简写。必须写完整如checked=“checked”，selected=“selected”
8.给所有属性值加引号
在HTML中，你可以不需要给属性值加引号，但是在XHTML中，它们必须被加引号。还必须用空格分开属性。例：<hr width="75%"size="7"/>这也是不正确的.
9.使用CSS对页面进行合理的布局与框架的实例；
在制作网页的时候，不可避免的遇到框架结构设计的问题。对于这个问题，现在大多数人都采用表格（Table)来解决这个问题。可是在现在这么一个新旧交替如此迅
速的时代，古老的方法将渐渐被新的方法所取代。毫无疑问，新兴起的DIV技术将取代表格（Table)在市场一统的局面，成为现在更多的使用者所青睐的技术。该技术的新的体现方式以及其新的理念，将使网站编写进入一个新的层面。
我们所熟知的表格（Table)在网页当中，不但所编辑的代码相当繁琐，所占用的空间也是非常大。如果一个网页的代码非常的复杂的话，那么它的容量大小就会“节节攀升”，从而影响到它运行的速度。而DIV最显著的功能就是对整个网站的代码进行了优化，不但使其方便修改，更使得整个网站运行速度快捷而平稳。这就是使得DIV的认知学习运用，将会对我们将有非常大的助益，使我们所编写的网站更加的简洁，方便，整齐，并易于修改。
div是XHTML指定的专门用于布局设计的容器对象；它与其他XHTML对象一样，我们只需应用<div></div>这样的标签形式，将内容放置在其中，便应用div标签
div除了可以直接放入文本，也可以放入其他标签，也可以多个div进行嵌套使用，最终目的就是合理的标识出我们的页面区域
div对象在使用时，同其他XHTML一样，可以加入其它属性，如：
id,class,align,style等，而在CSS布局方面，为了实现内容与表现的分离，不应当将align,style等编写在XHTML页面的div标签之中，因此，div最终代码只能拥有以下两种形式:
<div id=“id名称”>[…]</div>或<div class=“class名称”>[…]</div>
我们首先来看看DIV，通俗来说，它是一个盒子，将一些东西（属性）装在里面。可以把它定义成一个内容块。
body{}
#div_Container{}
#div_Header{}
#div_PageBody{}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。