布局遇到的问题 非常不错的见解_CSS/HTML

前言
还未等到下一代WEB开发技术RIA技术成熟之前,当然还得与HTML作斗争。前段时间《网站重构》炒得挺热，
这些都是进步，的确给我们新的思想。在这里总结一些开发中的点滴经验。

布局
1、上下左右布局
刚开始学制作页面，用的是MM的DW软件，可视化，让更多人学会网页制作。
还记得当初做页面用的还是DW,一个朋友问过我这一样一句话:"做网页表格多还是用层多，有什么区别?"。
我告诉他其实DW中用布局-布局表格，很快画出整个页面的框架, 然后一步步细化。做页面是挺快的事情,建议用表格，用层不好控制位置。
现在想起来真是有点误导的成份。哈，不过也许，进步需要一个过程。

《网站重构》春风吹来，用层进行页面布局的确给予我们开发带来了新的思想。
优点:
页面更清晰，代码量减少;
CSS的应用更广泛。

上下排,分层清晰,代码demo:

左右排，可以用绝对定位
#head{
position:absolute
top;10px;
left:200px;
}

2、DIV中的尽量少嵌套DIV，可用

3、用padding控制层之间的分隔

4、用border制作结构之间的分隔线

5、可以用CSS的少用图片

页面布局demo（可查看源码，比以往TABLE布局的清晰多了）：
http://davidblog.blogdriver.com/davidblog/inc/demo_div.jpg

form
1、form的margin以及padding
以往在页面中插入一个表单时,总是觉得margin,padding默认不为0，有时会影响页面的布局.
可以用CSS将其设加0
form{
margin:0 0 0 0px;
padding:0 0 0 0px;
}
同样p标记或其它标记你也可以定义.

2、select
optgroup的应用

3、为checkbox或radio加上label
今日

4、button
前一个项目用的是图片的button。逐渐发觉应用中的缺陷。
建议还是用CSS美化。
其实CSS可以实现更美观的button


table
该用table还是得用table的。table 始终有他优胜的一面。
例如一些数据显示的GRID或结构比较统一的,分行分列的布局.
table 相关技巧




CSS Expressions的应用
用CSS应用可减少代码的编写
1、table 鼠标事件


2、
width:expression{document.body.clientWidth


值得留意的标记

菜单1

菜单2

• 
  
  
  
  
  

  
  

  Health information:

  
  Height
  Weight
  

  
  ^superscript

声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系[e-mail]核实处理。