html - Font Awesome 图标重复

标签 html css

如果我们多次使用 font awesome/css :bfore:After 伪选择器的内容代码会怎么样。示例

#div:before {
 font-family: 'FontAwesome';
content:"\f0c9 \f0c9 \f0c9 \f0c9"; /*SEE I USED "\f0c9" more than one time */
} 

实例: http://jsfiddle.net/1ep1vnL4/

如果我在生产中使用它,这是一个好的做法吗? 因为我想使用一个图标 3 次,所以我懒得放 3 个新的 div 并再次重复所有内容。

最佳答案

不好用&mdash;&mdash;&mdash;而不是 <div>&mdash;</div><div>&mdash;</div><div>&mdash;</div>

Font Awesome 只是一种字体……它与使用任何其他字体中的任何字符一样。在 :before 中使用 3 或 4 个字符伪元素与在 <p> 中使用 3 或 4 个字符没有太大区别。标签。

如果您要为每个字符使用不同的元素(div、span、p),会有更多开销。

关于html - Font Awesome 图标重复,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40323652/

相关文章:

html - 图片不适合 WKWebView

javascript - 单击按钮时如何获取选择文本、表格单元格值

javascript - 在 Javascript 中将表格打印为两部分

html - 线性渐变在 Safari 上不显示正确的颜色

HTML 延迟缩进

HTML 数据 URI 浏览器兼容性

javascript - 从登录页面重定向到主页

css - Div Left & Right 但也顶部和底部居中?

javascript - 试图找到一个简单/优雅的js/jquery解决方案来控制用户图像定位、旋转和缩放

php - Str_Replace 正在替换 php 语法