Question

HTML：

<a id="postanad"  href="postad.php">Make a Post</a>

CSS：

#header #postanad {
    position: absolute;
    top: 50px;
    left: 250px ;
    background: #000 url(postad.gif) repeat-x 0% 100%;    
    font: bold 19px Tahoma, 'trebuchet MS', Sans-serif; 
    padding: 5px;


}

如何确定div元素所采用的像素/ ems大小，以便我可以使背景图像postad.gif具有相同的宽度？

为了清楚起见我不想动态确定宽度，只是想知道它占用了多少空间，以便我可以在PS中绘制背景图像。

Answer 1

如果您对jQuery感到满意，可以使用$（“＃postanad”）。width（）。

Answer 2

CSS不是一种“编程语言”。您无法真正做出决策，收集数据或操纵语言不是为此而设计的任何内容。如果你想这样做，javascript是你最好的选择。

你想要在背景中发生什么？如果我们了解您的要求，我们可能会帮助您获得仅限CSS的解决方案。

Answer 3

如果您对测量页面上元素的宽度感兴趣，可以在Firefox上使用Measure IT插件：

https://addons.mozilla.org/en-US/firefox/addon/539/

Answer 4

有问题的div是否会动态重绘？因为如果没有，最简单的方法是在#header #postanad样式中设置高度和宽度。

Answer 5

jQuery方式，就像@ orthod0ks所说的那样会使用width（）函数。 CSS方式是声明width和height

或者，另一种CSS方式是：

您还可以在div上添加背景（例如background: red;），截取屏幕截图，然后粘贴到PS中以查看它有多大。

最后，Firefox有一个名为（MeasureIt）的插件。它对于根据像素确定事物的大小非常有用。因此，如果两种解决方案都不适合你，你应该研究一下。

祝你好运！

Answer 6

如果有人想通过简单的javascript使用来获取div的宽度：

document.getElementById('div_id').clientWidth;

更多可能性看看here。

获取div元素的宽度

6 个答案: