|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
这工具比表格好的唯一就是你可以定义一个ID,想怎么玩它就怎么玩他,表格用来处理显示数据,DIV+CSS+TABLE就行了,都什么年代了,以前没有DIV,而且386的年代不也一样,现在都奔腾4了
比来几天细心研讨了一下vertical-align这个属性,了局让我年夜吃一惊,这个很“资深”的CSS尺度居然在各个扫瞄器内里的体现都各不不异。
vertical-align的值有点多,包含baselinesubsuppertoptext-topbottomtext-bottommiddle和各类长度值(%,em,ex等等)。我先给人人看一个我以为最夸大的值:bottom。代码以下:
p{
font-size:18px;
line-height:36px;
font-family:Tahoma,sans-serif;
}
img{
vertical-align:bottom;
}
然后人人看一看这段CSS在各个扫瞄器中的效果(图片是我存心做成谁人模样,为了能够看分明绝对地位):
呃,这个了局实在很让人匪夷所思,一样平常我会以为Firefox会比IE注释得改正确,可是看过Opera以后发明它和IE是一样的,而Safari/Win是站在Firefox何处。说假话,我不晓得这是怎样回事。
细心进修了《CSS威望指南(第二版)》,乃至还往查阅了W3C,然后本人做出一个关于vertical-align的图:
依照W3C的界说,当内联元素的vertical-align设置为:
- baseline,top,bottom的时分,都是该元素的baseline(或middle,top,bottom)对其四周元素的不异地位,如图片的top和四周笔墨的top对齐。
- text-top和text-bottom的时分,是该元素的top(或bottom)对齐四周元素的text-top(或text-bottom)。
- 长度(%,em,ex)的时分,是基于baseline往上挪动,以是负数往上,正数往下。
- middle的时分,是该元素的中央对齐四周元素的中央。这里“中央”的界说是:图片固然就是height的一半的地位,而笔墨应当是基于baseline往上挪动0.5ex,亦即小写字母“x”的正中央。可是良多扫瞄器常常把ex这个单元界说为0.5em,以致于实在纷歧定是x的正中央(以上图为例,x的高度应当是10px,而em是18px,以是两个值纷歧样)。
可是,即便是依照下面的原则,各个扫瞄器的注释云云悬殊也让我匪夷所思。我也懒得往研讨为何是如许子。总的来讲呢,应当就是它们对字体的每条线的地位的界说都不年夜一样,以是这个成绩不但跟vertical-align有关,而跟扫瞄器对内联文本和内联图片的布局的注释有很年夜干系。
最初给人人一个测试页面,能够方面的看看各个扫瞄器对vertical-align分歧值的注释了局。
http://www.mikkolee.com/weblab/001_vertical/
人人能够测试一下其他的值,好比middle或是text-top,也是各个扫瞄器完整纷歧样。有甚么心得人人来会商一下吧~~
有了CSS,我们不再需要用FONT标签或者透明的1pxGIF图片来控制标题,改变字体颜色,字体样式等等 |
|