css+xhtml页面构建的心得总结【转】
当前位置:点晴教程→知识管理交流
→『 技术文档交流 』
写了这么长时间的静态页面了,有必要来整理一下网页代码的书写心得,也许会对读者您有所帮助。我按照一般页面构成来说吧。
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 编辑过 |
关键字查询
相关文章
正在查询... |