1

所以我已经设置Compass了使用SCSS. 一切顺利，它为我生成了一些不错的 CSS :-

.icons-sprite, .actions-new, .actions-edit, .actions-save, .actions-delete, .actions-refresh {
  background: url('/content/themes/admin/images/icons-s0336d5eb89.png') no-repeat;
}

.actions-new {
  background-position: 0 -48px;
}

... ... ...

现在我正在创建一个表，在该表中有一个“操作列”，您可以在其中对行执行功能（删除或编辑）。

使用精灵显示这些按钮的普遍接受的方式（在 html 5 中）是什么？

我探索了一些选择并遇到了一些问题

  • span除非我将它置于模式下，否则我无法显示它，display: block如果我这样做，它会在项目之后插入新行，我不想让所有东西都浮动

  • div由于某种原因，这个甚至没有显示

  • img我看到的最大问题是对src字段的要求，这意味着我需要一遍又一遍地复制网址。

其他人在链接内使用什么精灵？

4

1 回答 1

1

使用跨度和display: inline-block. 这将使跨度表现得像一个图像，所以你可以应用vertical-align: middle. 如果您在内联元素上使用它，则支持一直追溯到 IE6。

于 2012-07-29T01:04:04.880 回答