图标(左)和文本(右)或左侧相反的文本和右侧图标的最佳方法是什么? 图标图像和文字的大小必须相同吗?理想情况下,我希望他们是不同的,但是在同一垂直方向。 我使用background-posit
...图标(左)和文本(右)或左侧相反的文本和右侧图标的最佳方法是什么?
图标图像和文字的大小必须相同吗?理想情况下,我希望他们是不同的,但是在同一垂直方向。
我使用background-position css属性从更大的图像中获取图标。
这是现在我该怎么做,但我正在努力使他们在同一条线上或垂直对齐底部。
文本
这是我尝试你的建议后得到的。
虽然文本现在与图标对齐,但它叠加在我想要的图标右侧的图标上。请注意,我正在使用背景位置从更大的图像集中显示图标。
基本上我得到了
<icon><10px><text_and_unwanted_icon_to_the_right_under_it><span class="group3_drops_icon group3_l_icon" style="">50</span>group3_drops_icon {background-position:-50px -111px;}.group3_l_icon {-moz-background-clip:border;-moz-background-inline-policy:continuous;-moz-background-origin:padding;background:transparent url(/images/group3.png) no-repeat scroll left center;height:35px;overflow:hidden;padding-left:55px;}.
解决方法
. 我通常使用背景:<style type="text/css">.icon {background-image: url(path/to/my/icon.jpg);background-position: left center;background-repeat: no-repeat;padding-left: 16px; /* Or size of icon + spacing */}</style><span class="icon">Some text here</span>. ..