精彩专题推荐:建站之入门课 建站之必修课 建站之关键课 网站价值所在 流量提高专题 css+div 标准 个人网站打造全过程
返回建站学首页
导航:
建站首页 | 网站设计 | 网站开发 | 网站运营 | 网页软件 | 建站指南 | 搜索优化 | 图像处理 | 视频教程 | 书籍教程 | 建站专题
当前位置:首页>网站设计>网页布局>正文

网页制作:CSS布局如何进行


来源:网络 时间:07-08-28 点击: 点击这里收藏本文

CSS具有两面性。就像它在格式化文本、导航栏、图片以及其他小小的网页方面很棒一样,当你准备好布局完整的网页时,它真正可怕的一面也展现出来了。

CSS布局有两种风格——绝对定位和浮动。绝对定位让你把一个元素以像素级的精确性定位在网页的任何位置——或者理论上是这样。这种整体控制令人兴奋,就如你将在下一章中所看到的,但是实际上很难实现。这就是大量网页使用基于浮动的布局的原因,也是本章的主题。

CSS布局如何进行

How CSS Layout Works

如在第1章中讨论过的,HTML的局限性迫使设计师们去开发更聪明的方式来使他们的网页更美观。过去最常用的工具是<table>标签,它本是用来创建电子数据表——比如由数据行和列组成的信息显示表。但是设计师们却用HTML的表格来创建一种用来组织网页内容的脚手架(见图11-1)。可是由于<table>标签本来不是要用于布局的,因此设计师们不得不经常以各种不寻常的方式来使用这个标签——比如把一个表格放在另一个表格的单元里面——仅仅为了得到他们想要的效果。这种方法的工作量很大,增加了大量额外的HTML代码,并使得后面要修改设计很难。但是在CSS出现之前,那就是网页设计师们所拥有的一切办法。

如果你已经习惯于使用<table>标签,那么当你开始使用CSS进行布局时,必须发展一种新的思维。首先,忘掉行和列(运用表格时的一种重要的观念)。没有

网页制作经验分享:CSS布局如何进行

列跨度、行跨度和格子状的表格结构在CSS中是找不到的。然而,你可以把一个<div>标签当成一个表格单元。有了表格单元,<div>标签就是把你要的内容定位在网页区域的一个逻辑位置。此外,如你所见,CSS设计经常把一个div嵌套在另一个div里面,就像你把表格嵌套在表格里面来获得特定的效果一样——但是,幸运的是,CSS方法只用少得多的HTML代码。

强大的<div>标签

9 7 3 1 2 4 8 :

  把此文章收藏到:          
广而告之
文章搜索
  • Google JZxue.Com

关于我们 | 联系我们 | 友情链接 | 网站地图
Copyright © 2005 - 2006 建站学 All rights reserved.