利用图片进行定位

利用图片进行定位

左直拳

 

好多人说,现在页面是用DIV + CSS 来定位,可以完全抛弃TABLE了。在我看来,这纯粹是扯蛋。扯蛋,意思就是用嘴含着阴囊的皮,向旁边扯去。

不过,用TABLE来定位,有时也会有点问题。比如说,定义一个列表,有三列,其中有两列的宽度固定,放些“编辑”、“浏览”之类的文字,而另一列放标题,相对比较宽。如下:

<table width="90%" border="1">

<tr><td>标题</td><td style="50px">&nbsp;</td><td style="50px">&nbsp;</td></tr>

<tr><td>长洲宾客人数多</td><td align="center">浏览</td><td align="center">编辑</td></tr>

</table>

标题    
长洲宾客人数多 浏览 编辑

 

这样一来,如果页面缩放拉伸,“浏览”、“编辑”这些文字就有可能变形,缩成一对,由一行变两行。其实我们最希望的结果是:“标题”栏随页面自动伸缩,而“”浏览,“编辑”栏固定。

怎么试都不成功,看来只能用图片了。

在开头增加一行:

<table width="90%" border="1">

<tr><td style=100%;></td><td><img src=很小的图片 width=50px height=0px alt=””/></td><td><img src=很小的图片 width=50px height=0px alt=””/></td></tr>

<tr><td>标题</td><td>&nbsp;</td><td>&nbsp;</td></tr>

<tr><td>长洲宾客人数多</td><td align="center">浏览</td><td align="center">编辑</td></tr>

</table>

这样子不论所在页面如何缩放拉伸,”浏览,“编辑”都不会变形。

原理如下:第一列(标题列)宽度为100%,所以会拼命扩张;但浏览和编辑列有两张图片在,而图片是不会折叠的,所以这两列刚刚好撑住了图片指定宽度的空间.以后页面缩放,其实变的只是标题列的宽度,刚好符合我们的要求

 

原文地址:https://www.cnblogs.com/leftfist/p/4258282.html