谈网页制作中table与div方法布局网页框架的利和弊
第二步,新建CSS样式
新建完后将CSS样式的边框、底纹以及高度和宽度设置好。这样就设置好了顶部单元格。
设置好所有的css属性后,点击dreamweaver的编辑窗口div标签,点击如图5属性栏中的div ID应用即可。
第三步,使用相同的方法继续插入布局对象中的DIV标签,第二行插入DIV应注意,首先插入一个大的div容器,然后在里面插入左中右三个div ,定义好每个div的宽度后,注意左边和中间的div容器的css代码必须写入:float: left;否则div容器是无法形成横排的
第四步,使用相同的方法插入底部的第六个div容器。保持与上面容器宽度一致,同时在css代码中将每个div容器的底纹和边框设置好。
2 总结网页布局的两种方法的优点与不足之处
使用table表格来布局网页框架的优点:制作方法直接,直接通过插入菜单中插入以及属性栏中设置所有的操作即可,无需定义CSS样式;制作的速度快。缺点:由于html文件中的table标签的浏览速度较慢,所以,使用嵌套表格的方法来布局网页框架会使网页浏览的速度变慢。
使用DIV的方法布局网页框架的优点:可以通过css样式给框架进行功能强大的属性设置以及给网页的局部进行任意的定位,制作出来的页面浏览速度较快,同时页面的风格可以通过修改单独的css文件进行随意的修改和更新;缺点:每个div容器都需要定义css样式来控制,制作过程相比table方式要复杂。现在的网页越来越倾向于使用DIV的方法来布局网页了。
3 table与div方法布局网页框架的应用
table方法布局网页主要应用在功能较为简单、页面不多的网站中;而div主要应用于大型的网站页面设计中。
4 总结
本文通过dreamweaver 8.0从table与div两种方法来布局制作网页框架的操作步骤以及浏览效果方面分析比较了网页制作中这两种方法布局网页的优点与缺点,并且总结了他们各自应用的范围。
新建完后将CSS样式的边框、底纹以及高度和宽度设置好。这样就设置好了顶部单元格。
设置好所有的css属性后,点击dreamweaver的编辑窗口div标签,点击如图5属性栏中的div ID应用即可。
第三步,使用相同的方法继续插入布局对象中的DIV标签,第二行插入DIV应注意,首先插入一个大的div容器,然后在里面插入左中右三个div ,定义好每个div的宽度后,注意左边和中间的div容器的css代码必须写入:float: left;否则div容器是无法形成横排的
第四步,使用相同的方法插入底部的第六个div容器。保持与上面容器宽度一致,同时在css代码中将每个div容器的底纹和边框设置好。
2 总结网页布局的两种方法的优点与不足之处
使用table表格来布局网页框架的优点:制作方法直接,直接通过插入菜单中插入以及属性栏中设置所有的操作即可,无需定义CSS样式;制作的速度快。缺点:由于html文件中的table标签的浏览速度较慢,所以,使用嵌套表格的方法来布局网页框架会使网页浏览的速度变慢。
使用DIV的方法布局网页框架的优点:可以通过css样式给框架进行功能强大的属性设置以及给网页的局部进行任意的定位,制作出来的页面浏览速度较快,同时页面的风格可以通过修改单独的css文件进行随意的修改和更新;缺点:每个div容器都需要定义css样式来控制,制作过程相比table方式要复杂。现在的网页越来越倾向于使用DIV的方法来布局网页了。
3 table与div方法布局网页框架的应用
table方法布局网页主要应用在功能较为简单、页面不多的网站中;而div主要应用于大型的网站页面设计中。
4 总结
本文通过dreamweaver 8.0从table与div两种方法来布局制作网页框架的操作步骤以及浏览效果方面分析比较了网页制作中这两种方法布局网页的优点与缺点,并且总结了他们各自应用的范围。