LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

css+xhtml页面构建的心得总结【转】

admin
2010年8月13日 22:29 本文热度 3971
写了这么长时间的静态页面了,有必要来整理一下网页代码的书写心得,也许会对读者您有所帮助。我按照一般页面构成来说吧。
login:
头部一般会有登陆条。写用户名密码的地方,建议字和input分别用单独类的margin来控制。大家都知道文字和input在一起的时候用line-height并不会起什么效果。记得用户名和密码的文字用label标签。
logo:
这个可能有值得商榷的地方。有人喜欢把LOGO用H1来显示,有人喜欢背景显示LOGO而代码隐藏文字。具体对SEO的影响自己去体会吧,不妨都试试,不过LOGO上总要带链接的。
nav:
导行菜单一般都用LI来做,不过最好带上浮动float:left,而不仅仅是display:inline,这样控制起来可能更精确一点。至于象门户那样复杂的菜单就可以自由发挥,比如我之前写的一个菜单。.
search:
搜索的输入框和按纽用padding值来控制里面字的显示吧,用height和line-height的效果可能在各个浏览器里不尽相同。按纽如果都用系统默认的样式就别清除默认的border值,如果用图片就必须清除.line-height的值比height大点可能效果会好点,不过要溢出剪切哦。
banner:
这个其实没什么可说的,但是针对一行多个广告条,我还要补充一句,banner既可能是图片也可能是FLASH,写的时候套个DIV写个宽度和溢出剪切没坏处。
list:
列表是出现最多的。控制内容和边框的间距最好给ul用padding,并且加宽度和剪切。至于li就要用height和line-height来控制了,如果回行也要剪,保证标题内容代码的完整而又不破坏页面美观。前面加点那肯定是用背景图片来控制了,默认的项目符号真的不好用。
titleBar:
标题行一般就是单独居左出现,或者右面是more和tags。这个写法也是根据每个人习惯不同而有变化的。我最近试着标题用H3,more或tags用H4来写。以后关注一下效果如何。毕竟这样的话,在没有加载样式的情况下,某块内容的标题会突出显示。当然more和tags用span写也可以,这样看具体显示的内容而定了。
pictureWrap:
图文混排的表现形式比较多,语言描述也太麻烦就不说太多了。想说的就是图片配标题的时候,给标题加个class,定义一下宽高和行高,然后溢出剪切,这样标题太长也不会挤乱页面了。而且写动态程序的时候也不用去数截取多少个字了。毕竟,我们想留给读我们代码的爬虫一个完整的标题。
footer:
这个也没多少可说的,该怎么写就这么写,能用A标签的就不用li了。记得统计代码放在最后,而且最好给他一个dispaly:none的样式。

好了,就写这么多吧,虽然很多代码可能是需要重复敲打好多遍的,可是如何写出既让人又让机器读的舒服的代码,是我们需要逐步总结和研究的,而这更是我们努力的方向。

PS:以上纯粹是本人一个时期内的心得总结,如有不妥之处还请您不吝赐教,共同进步!

该文章在 2010/8/13 22:29:41 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2024 ClickSun All Rights Reserved