关于网站标准化进程中的居中问题
来源:互联网 发布:墨香快刀源码 编辑:程序博客网 时间:2024/04/29 13:02
昨天晚上RE问我,说如何让表格居中,但又不让表格的单元格里的内容居中,并且他不想用非标准化的表现,比如说像<table align=”center”>这样子,像后他就在外面加了个<div id=”centertable”>然后设置,这个ID的text-align:center;
结果,让他失望了.
在XHTML以及CSS2.0里,居中属性只有一种,就是text-align,其实,他的作用就和字面意思一样,是让文本居中的,如果设置*{text-align:center;}或是body {text-align:center;}那就是网页里的所有内容都居中了,包括大的表格以及其中的单元格.这个很好解决,可以这样来定义
body {text-align:center;}
p,td,div {text-align:left;}
这样的话就可以 .表格可以居中,但里面的内容还是如原来一样的居左的,对于IE这样的设置已经够了,但对于如mozilla这样的浏览器来说,body{text-align:center;}这个设置是无效的,IE和MOZILLA的盒模型的解释是不一样的,导致结果也就不一样了.
我们可以再加入这个属性
body {
text-align:center;
margin-left:auto;
margin-right:auto;
}
这样一来,在MOZILLA里时显示也就居中了,并且这个设置并不影响IE的正常显示.
另外对于,CSS的设置,还是求精简化好一些,比如说设置链接a的属性,同样的设置不必在每个ID里或是a的每个伪类里去设置,而一些特殊的再去特殊设置.例如:
a {
padding:10px;
display:block;
}
a:hover {
background:#eee;
color:#369;
}
如上a里的属性就不用再在a:hover里再写一遍了...
还有一个用DIV+CSS设计要注意的问题就是,如果你定义了一个DIV的宽度,那么他的实际宽度应该 是
div's width=width+padding left+padding-right+border left+ border right
而如果还有margin属性的话,他占用的空间还得再加上margin的值了.
结果,让他失望了.
在XHTML以及CSS2.0里,居中属性只有一种,就是text-align,其实,他的作用就和字面意思一样,是让文本居中的,如果设置*{text-align:center;}或是body {text-align:center;}那就是网页里的所有内容都居中了,包括大的表格以及其中的单元格.这个很好解决,可以这样来定义
body {text-align:center;}
p,td,div {text-align:left;}
这样的话就可以 .表格可以居中,但里面的内容还是如原来一样的居左的,对于IE这样的设置已经够了,但对于如mozilla这样的浏览器来说,body{text-align:center;}这个设置是无效的,IE和MOZILLA的盒模型的解释是不一样的,导致结果也就不一样了.
我们可以再加入这个属性
body {
text-align:center;
margin-left:auto;
margin-right:auto;
}
这样一来,在MOZILLA里时显示也就居中了,并且这个设置并不影响IE的正常显示.
另外对于,CSS的设置,还是求精简化好一些,比如说设置链接a的属性,同样的设置不必在每个ID里或是a的每个伪类里去设置,而一些特殊的再去特殊设置.例如:
a {
padding:10px;
display:block;
}
a:hover {
background:#eee;
color:#369;
}
如上a里的属性就不用再在a:hover里再写一遍了...
还有一个用DIV+CSS设计要注意的问题就是,如果你定义了一个DIV的宽度,那么他的实际宽度应该 是
div's width=width+padding left+padding-right+border left+ border right
而如果还有margin属性的话,他占用的空间还得再加上margin的值了.
- 关于网站标准化进程中的居中问题
- SQLite: 关于日期的标准化问题
- 关于DIV在Mozilla Firefox中的居中问题
- 关于CSS中的居中问题的思考及解决方案
- 关于css中的水平垂直居中问题总结
- 关于导航在浏览器中的定位以及div居中问题
- 关于自定义view中的文字垂直居中的问题。
- 关于radioButton居中问题
- 关于居中问题
- 梯度下降中的归一化、标准化问题
- css中的居中问题
- 关于css中的内容左右居中和垂直居中问题的简单处理
- 关于CSS中的居中方法
- 关于页面居中的问题
- 关于DIV高度居中问题
- 关于CSS各种居中问题
- 关于UITableViewCell文字居中问题
- 关于垂直居中的问题
- 中国新富阶层调查:讨厌日本却爱日货 梦想美国[转载]
- 利用seh进行错误处理(转)
- 改造blog
- 嗨 甲骨文【4】
- 关于“软件学院”的思考
- 关于网站标准化进程中的居中问题
- 常用正则表达式收藏
- testfile
- 避免在Java中使用Checked Exception
- Mozilla Sunbird
- 超级搜索引擎
- 结构化异常处理(seh) (转)
- 关于DEV的TreeList控件的使用(1)
- 统一建模语言(UML)的九种模型图