在图像上添加字体真棒相机图标?

时间:2015-03-25 11:20:18

标签: html css font-awesome styling

我正在使用bootstrap hunter的主题作为我的项目,该项目有个人资料页面,链接如下。

Demo Profile Page

现在个人资料页面有图片。我已经编写了代码,如果有人点击图像,它将打开一个模式来上传新图片但现在我希望图像是可点击的并且在悬停时显示来自字体真棒图库的相机图标,但我可以&# 39;似乎要做到这一点。

我在img标签周围添加了锚标签,但是样式会搞乱,我想因为主题中的CSS适用于div.profile-pic的子img,当我将img标签包装在锚点内时,它混乱了。

除此之外,我尝试了这个图标:

img#photo:hover:before{
    font-family: 'FontAwesome';
    content: '\f01a';
  }

图标代码可能不适用于相机,但不会显示任何内容。我不知道为什么。如何将相机图标放在图片上并使其可点击?

0 个答案:

没有答案