CSS网页布局:网页页面结构化网站建设网页设计新网创想

网页设计知识
企业网站建设完成之后

企业网站如何提高客户转化率

增加网站有效内容对于网站推广的作用

搜索引擎工作流程对网站推广的影响

网站建设为公司创造价值需注意的三个方面

企业建网站必读－建站、推广全掌握！

商业网站建设设计原则

中小企业网站推广的11个秘笈

商业网站设计之美往往来自于细节

网站建设中应注意的问题

企业网站建设的六大功能

网站优化的基本知识

网络营销2.0让中小企业获得实在的效果

网站改版需要把握的几个问题

如何通过网络建立品牌形象

企业网站设计规划和网页设计问题归纳

网站设计的同时应考虑到SEO优化

企业网站设计存在的五大问题

网站对企业的价值

企业网站建设应注意著作权问题

网页设计的需注意的一些基本原则

网页布局设计基础

网页界面设计系列

CSS样式表设计的十条技巧

个性化网站设计

网页设计常用的CSS样式表滤镜

企业网站文化与网页设计

网页设计之黄金分割

网页设计中的功能与美化

网页的版式设计—文字的格式化

网站设计相关基础知识

您当前的位置：新网创想--网站建设--网站设计--CSS网页布局:网页页面结构化
CSS网页布局:网页页面结构化

上一篇 CSS网页布局:网页页面结构化 | 下一篇 CSS网页布局:网页页面结构化
亲自实践一下结构化
上面说的只是最基本的结构，实际应用中，你可以根据需要来调整内容块。常常会出现DIV嵌套的情况，你会看到"container"层中又有其它层，结构类似这样：
＜div id="navcontainer"＞
＜div id="globalnav"＞
＜ul＞a list＜/ul＞
＜/div＞
＜div id="subnav"＞
＜ul＞another list＜/ul＞
＜/div＞
＜/div＞
嵌套的div元素允许你定义更多的CSS规则来控制表现，例如：你可以给#navcontainer一个规则让列表居右，再给#globalnav一个规则让列表居左，而给#subnav的list另一个完全不同的表现。
用CSS替换传统方法
下面的列表将帮助你用CSS替换传统方法：
HTML属性以及相对应的CSS方法
HTML属性
CSS方法说明
align="left"
align="right" float: left;
float: right; 使用CSS可以浮动任何元素:图片、段落、div、标题、表格、列表等等
当你使用float属性，必须给这个浮动元素定义一个宽度。
marginwidth="0" leftmargin="0" marginheight="0" topmargin="0" margin: 0; 使用CSS, margin可以设置在任何元素上, 不仅仅是body元素.更重要的，你可以分别指定元素的top, right, bottom和left的margin值。
vlink="#333399" alink="#000000" link="#3333FF" a:link #3ff;
a:visited: #339;
a:hover: #999;
a:active: #00f;
在HTML中，链接的颜色作为body的一个属性值定义。整个页面的链接风格都一样。使用CSS的选择器，页面不同部份的链接样式可以不一样。
bgcolor="#FFFFFF" background-color: #fff; 在CSS中，任何元素都可以定义背景颜色，不仅仅局限于body和table元素。
bordercolor="#FFFFFF" border-color: #fff; 任何元素都可以设置边框(boeder)，你可以分别定义top, right, bottom和left
border="3"cellspacing="3" border-width: 3px; 用CSS，你可以定义table的边框为统一样式，也可以分别定义top, right, bottom and left边框的颜色、尺寸和样式。
你可以使用 table, td or th 这些选择器.
如果你需要设置无边框效果，可以使用CSS定义： border-collapse: collapse;
＜br clear="left"＞
＜br clear="right"＞
＜br clear="all"＞
clear: left;
clear: right;
clear: both;
许多2列或者3列布局都使用 float属性来定位。如果你在浮动层中定义了背景颜色或者背景图片，你可以使用clear属性.
cellpadding="3"
vspace="3"
hspace="3" padding: 3px; 用CSS，任何元素都可以设定padding属性，同样，padding可以分别设置top, right, bottom and left。padding是透明的。
align="center" text-align: center;
margin-right: auto; margin-left: auto;
Text-align 只适用于文本.
象div，p这样的块级可以通过margin-right: auto; 和margin-left: auto;来水平居中
一些令人遗憾的技巧和工作环境
由于浏览器对CSS支持的不完善，我们有时候不得不采取一些技巧(hacks)或建立一种环境(Workarounds)来让CSS实现传统方法同样的效果。例如块级元素有时侯需要使用水平居中的技巧，盒模型bug的技巧等等。