在导航栏中将“内容”替换为“图像”

Praveenkumar Beedanal

    
    
    
.fa-home:before {
    content: "\f015";
}
<li>
  <a href="/index.php" class="homelink">
    <i class="fa fa-home"></i>
  </a>
</li>

我想将导航栏中的“内容”属性“ home”值替换为导航栏中的相应图像。

这是我的“内容”属性的CSS

.fa-home:before 
{
   content: "\f015";
}

因此,现在我需要将其替换为“ header_home.png”图像。有人给我信息如何用图像替换它。

Yonas Hailu

您可以使用类似这样的东西。您可以按照需要使用变换比例来控制图像的宽高比。如果我的问题正确无误。

.fa-home:before {
    content:url(/concrete5/application/images/header_home.png);
    transform: scale(1);
}

您也可以使用此方法来控制高度和宽度

.fa-home:before {
    content:"";
    display: inline-block;
    width: 30px; 
    height: 30px;
    background-image: url(/concrete5/application/images/header_home.png);
    background-size: 30px 30px;
}

小提琴

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

导航栏封面内容

来自分类Dev

appgyver导航栏图像

来自分类Dev

CSS导航栏与图像

来自分类Dev

appgyver导航栏图像

来自分类Dev

CSS导航栏与图像

来自分类Dev

如何在jsp中将图像标签替换为视频标签

来自分类Dev

页面内容被导航栏覆盖

来自分类Dev

导航栏重叠内容文本

来自分类Dev

内容下方的导航栏

来自分类Dev

页脚导航栏重叠内容

来自分类Dev

导航栏垂直显示内容

来自分类Dev

在PHP中将\“替换为”

来自分类Dev

被导航内容取代的垂直导航栏按钮

来自分类Dev

在引导程序中将超大徽标图像添加到固定的底部导航栏中

来自分类Dev

包含导航栏的流体图像

来自分类Dev

UI导航栏图像标题

来自分类Dev

发布更改导航栏图像?

来自分类Dev

导航栏由图像组成

来自分类Dev

导航栏中的重叠图像

来自分类Dev

导航栏中的中心图像

来自分类Dev

在Android应用程序中将原始图像替换为新图像

来自分类Dev

居中导航栏品牌图像与居中导航栏

来自分类Dev

将默认导航栏转换为粘性/固定导航栏?

来自分类Dev

如何在C#中将char(10)[SQL Server]替换为其他内容

来自分类Dev

在Bootstrap 4导航栏中将元素居中

来自分类Dev

在导航栏中将品牌形象居中

来自分类Dev

在引导程序中将导航栏链接居中

来自分类Dev

如何在导航栏中将表单居中?

来自分类Dev

在C#中将“ \”替换为“ \ /”