仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 2044|回复: 9
打印 上一主题 下一主题

[DIV+CSS] 学习下div+css结构中header部分题目和菜单栏的优化

[复制链接]
灵魂腐蚀 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 10:37:03 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
这便是Div的优势所在。带宽的稍多占用,完全显得微不足道,更何况一个冗余的table设计架构如果代码写的不好会占用更多的带宽。



在div+CSS结构中,一样平常都如许来全体构架的:
<divid="header"></div>
<divid="main"></div>
<divid="footer"></div>
而关于header部分,一定要显现网站题目,除显现网站题目外,还大概要显现其他对照主要的工具,好比网站的导航栏:
<divid="header">
<divid="title">这里是网站的题目</div>
<divid="nav">这里是网站导航栏</div>
</div>
良多人一样平常都如许写的,固然如许写并没有甚么语法毛病。但关于div来讲有个准绳,那就是尽少的利用div的嵌套(和table一样的弱点:1、关于用户:扫瞄器要损耗资本对嵌套的干系举行剖析,影响速率;2、关于搜刮:搜刮引擎对嵌套的层数大概有所限定)。并且如许写带给我们的可读性也不算太高。

那怎样才是最优化,最迷信的写法呢?
我们选用其他的Xhtml代码来代替下面的div,那又怎样选择呢??
起首题目的选择——我们晓得在xhtml中h1-h6是暗示题目的,而header里的题目在全页来看是最主要的,我们选择h1来暗示题目是天真烂漫的。
其次导航栏的选择——导航栏是由多个小块内容构成,我们选择无序列表
<ul><li></li></ul>
来暗示菜单最符合不外了!
最初以上的内容能够优化成:
<divid="header">
<h1>这里是网站的题目</h1>
<ul>
<li>这里是网站导航栏</li>
</ul>
</div>
以是在做网站时,天真使用h1、h2、h3、ul、li、dl、dt、dd、p、span等标签,能年夜年夜削减代码,增添代码的可读性,并且也布局加倍公道
现在我们不再使用之前所学的“table”定位技术,而是采用Div+css的方式实现各种定位。
若天明 该用户已被删除
沙发
发表于 2015-1-17 10:38:35 | 只看该作者
难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心,坚持不懈的决心。在自己无法解决某些问题时,就需要虚心请教别人.
蒙在股里 该用户已被删除
板凳
发表于 2015-1-20 18:18:48 | 只看该作者
帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。
山那边是海 该用户已被删除
地板
发表于 2015-1-29 14:15:10 | 只看该作者
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器,在编辑时能同时看到源码和设计界面,非常方便新手学习制作网页。
因胸联盟 该用户已被删除
5#
发表于 2015-2-6 02:03:57 | 只看该作者
每天上网看着那样多的网页,于是我才下定决心选择了网页制作这一门课程,目的就是希望以后能够做出一个完美的网页来。
小女巫 该用户已被删除
6#
发表于 2015-2-15 01:39:17 | 只看该作者
经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.
活着的死人 该用户已被删除
7#
发表于 2015-3-4 10:56:32 | 只看该作者
您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别,但它同时也存在着致命的弱点。
乐观 该用户已被删除
8#
发表于 2015-3-11 18:43:30 | 只看该作者
经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.
莫相离 该用户已被删除
9#
发表于 2015-3-19 07:59:22 | 只看该作者
布局表格、绘制层、制作CSS样式表等,这些内容迷糊了我的视线,真是没想到制作一个精巧别致的网页是如此的困难,可是心有不甘。
admin 该用户已被删除
10#
发表于 2015-3-27 16:12:09 | 只看该作者
以上大概就是文字图片的一些链接方法,通过学习Dreamweaver、练习让我对dreameaver8有了进一步的认识,他其实是一款很好的建立Web站点和应用程序的软件。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起,其功能强大,使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-23 00:34

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表