html - 使用 CSS 编码显示打印和电子邮件图标(并将它们设置为右浮动内联)

Question

我对我的默认打印和电子邮件图标没有显示在我的 Joomla 支持的站点中有疑问。我在 Joomla 用户界面中启用了它们，但只显示一个包含两个链接的列表。当我查看网络时，我发现了一个原因，如果您使用自定义模板并且图像丢失，则可能会发生这种情况。

现在我的问题是如何通过 CSS 编码解决这个问题？

感谢任何类型的提示或帮助。

Answer 1

假设您还想删除列表格式并且您的图标文件是 16x16 像素，只需将以下内容添加到您的 CSS 文件中:

ul.actions {
    list-style:none;
    float:right
}
.print-icon, .email-icon {
    display:inline-block;
    width:16px;
    height:16px;
    text-indent:-3000px;
    overflow:hidden;
}
.print-icon {
    background-image:url(path/to/yourprintimage.png);
}
.email-icon {
    background-image:url(path/to/youremailimage.png);
}

显然用实际图标替换文件名 ;)