通过css添加图像左侧的文本 [英] Add image to left of text via css
本文介绍了通过css添加图像左侧的文本的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何通过css将图像添加到某些文本?
How can I add an image to some text via css?
我有这个:
<span class="create">Create something</span>
,我想使用CSS添加一个16x16的图像左边。这是可能的,或者我应该手动添加这张图片,如下所示:
and I want to add a 16x16 image to the left of that by using css. Is this possible or should i just manually add this image like so:
<span class="create"><img src="somewhere"/>Create something</span>
我不想手动更改所有的地方,这就是为什么我想做通过css。
I'd rather not have to manually change all of the places which is why I wanted to do it via css.
谢谢!
推荐答案
.create
{
background-image: url('somewhere.jpg');
background-repeat: no-repeat;
padding-left: 30px; /* width of the image plus a little extra padding */
display: block; /* may not need this, but I've found I do */
}
用填充和可能的边距玩,直到你得到你想要的结果。您还可以使用背景位置或完全定义背景( link to w3 )。
Play around with padding and possibly margin until you get your desired result. You can also play with the position of the background image (*nod to Tom Wright) with "background-position" or doing a completely definition of "background" (link to w3).
这篇关于通过css添加图像左侧的文本的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文