如何在样式类中添加src？

-2

<div><img class="imgClose"></div>

我尝试添加这样的，但它不显示图像：如何在样式类中添加src？

<style type="text/css"> 
.imgClose 
{ 
    float: right; 
    margin-top: -15px; 
    background: 16px 16px no-repeat url(_assets/img/close.png); 
} 
</style>

如果我在HTML中添加，那么它的工作原理，但我想放src在风格类代替。

<div><img class="imgClose" src="_assets/img/close.png"></div>

来源

2012-05-14 issoa

你是否错过了现场代码中的关闭'>'？还是只是一个复制/粘贴问题？ – 0b10011

它是复制粘贴 – issoa

@Mayankswami：我知道它可以完成，但我的问题是在课堂上添加src。 – issoa

您不能从元素样式中添加元素属性（如src）。

来源

2012-05-14 17:23:25 Sampson

这回答你的问题。它不能做到。 – xbonez

的.imgClose需要的高度，为了正确显示的宽度......

当你把SRC图像中

，在div让他们automatticly，和多数民众赞成你的问题:)

来源

2012-05-14 17:25:30

-1

您必须指定width,height和display:inline-block|block;作为img的背景以正常工作，而不提供src属性。不过，我鼓励使用不同的元素，因为img元素专门用于使用src属性。

<style type="text/css"> 
.imgClose { 
display:block; 
width:16px; 
height:16px; 
float: right; 
margin-top: -15px; 
background: 16px 16px no-repeat url(_assets/img/close.png); 
} 
</style>

来源

2012-05-14 17:28:26 0b10011

这将工作，但它不是嵌入式图像，它是一个具有图像背景的div。您将无法右键单击以保存图像等。 –

@PhilipK，实际上，OP的HTML示例显示'

'，所以背景实际上应该在图像上。而且它也**可以保存背景，即使它被设置为没有'src'的'img'（在Firefox中测试过）。 – 0b10011

无论如何，这将验证失败。您的图片标签需要src属性。您可以添加一个空的div并将图像作为背景图像应用，或者您需要一个图像标签，您可以添加一个透明的占位符图像并使用css定义它的尺寸和背景图像。最好将尺寸添加到图像中，以便浏览器可以渲染页面，即使元素尚未下载。

但真正的问题是为什么你想这样做？

如果您的图像纯粹是装饰性的，您可以将其添加为背景图像。如果它在Html中很重要，请将其保留为具有src属性的图像标记。

我假设你想创建一个关闭按钮widgety thingy。对于添加带有文本内容的链接元素并使用CSS和文本替换进行设置可能会更好。

<a href="whatever" class="close-widgety-thingy">close the widget thing</a>

，并在CSS

.close-widgety-thingy { 
    text-indent: -12345em; 
    width: 16px; 
    height: 16px; 
    background: transparent url(path/to/close/image.png) no-repeat center center; 
}

难道你想实现什么？

来源

2012-05-14 19:00:31

如何在样式类中添加src？

回答

相关问题