什么 html 标签最适合与精灵一起使用
我想使用精灵来显示我的图标。我创建了图像和 CSS,现在我需要向 html 元素添加类。最好的 HTML 元素是什么?
工作正常,但当然它会跨越整个空间并进行环绕。仅当我在其中放入一些东西时才起作用。这是我的 CSS.sprite {
background:url('/i/sprites.png');
background-repeat:no-repeat
}
.ico2{
background-position:0 -104px;
width:16px;
height:16px
}
I would like to use sprites to display my icons. I created image and CSS, now I need to add class to my html element. What is the best HTML element for that?
<div>
works fine, but of course it spans across entire space and wraps. works only if I put something in it. Here's my CSS
.sprite {
background:url('/i/sprites.png');
background-repeat:no-repeat
}
.ico2{
background-position:0 -104px;
width:16px;
height:16px
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我的意见是,这并不重要。无论标签适合您的其余内容。
结构的布局非常灵活。
和
。
您可能希望对放置精灵的大多数元素使用
display: block
或display: inline-block
,并记住您可以为所有元素设置该值元素。My opinion is that it doesn't matter. Whatever tags are suitable for the rest of your content.
<ul><li></li></ul>
structures are very flexible for layout.<div>
and<span>
of course.You'll probably want to use
display: block
ordisplay: inline-block
for most of the elements where you put your sprites, and remember that you can set that for all elements.这取决于上下文。尝试选择最能代表数据语义的元素,而不是如何显示数据;这就是 CSS 的用途。
您是否正在显示图标列表?使用
并将精灵放入其
元素中。
It depends on context. Try to choose the element which best represents the semantics of the data, not on how it will be displayed; that's what CSS is for.
Are you displaying a list of icons? Use a
<ul>
and put your sprites in its<li>
elements.您可以使用
标签并将其显示设置为具有定义的高度和宽度的
inline-block
。You could use
<span>
tags and set it's display toinline-block
with defined height and width.