个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
30
4
我怎样才能使 Font Awesome 图标像本页中那样大:
http://fontawesome.io/icon/bath/
我使用了 fa-5x 类，但它与页面示例中最大的图标不同。
下面是我使用的 html 和 css，我想做大的图标是最后的浴缸
谢谢
.container-fluid{
height:50%;
}
#run{
background-color:green;
height:1000px;
}
.red{
background-color:red;
}
.green{
background-color:green;
}
.blue{
background-color:blue;
}
.reg{
height:400px;
}
.big{
height:1000px;
}
.pigi{
color:red;
font-size:225em;
}<!DOCTYPE html>
<html>
<head>
<title>example page</title>
<meta name="description" content="example page">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/Users/tomer/Desktop/test page/first.css">
<link rel="stylesheet" href="/Users/tomer/Desktop/font-awesome-4.7.0/css/font-awesome.min.css">
</head>
<body>
<!-----navigation bar------->
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a href="" class="navbar-brand">HelloMan</a>
</div>
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Page 1<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Page 1</a></li>
<li><a href="#">Page 2</a></li>
<li><a href="#">Page 3</a></li>
</ul>
</li>
<li><a href="#">Page 2</a><span class="glyphicon glyphicon-eur"></span></li>
<li><a href="#">Page 3</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><span class="glyphicon glyphicon-music"></span></a></li>
<li><a href="#"><span class="glyphicon glyphicon-eur"></span></a></li>
</ul>
</div>
</nav>
<!-----end navigation------>
<div class="container-fluid" >
<h1 style="text-align:center;">Example page</h1>
<div class="row">
<div class="col-md-4 blue big">
brushes
</div>
<div class="col-md-4 red reg">
Tishues
</div>
<div class="col-md-4 green reg">
Gunners
</div>
</div>
<i class="fa fa-bath pigi" aria-hidden="true"></i>
</div>
</body>
</html>最佳答案
为你的
添加一个额外的类 <i class="fa fa-example extraClass"></i>
在你的 CSS 上:
.extraClass{
font-size:50px;
}
或任何适合您的尺寸。
虽然你的问题很模糊。最好提供一个 jsfiddle。
关于fonts - 如何使 Font Awesome 图标变大？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40833480/
30
4
0
我一直在用awesome在 ubuntu 14.04 上一段时间。 rc.lua 中定义的默认布局是: layouts = { awful.layout.suit.floating,
Font Awesome 4.0是对 Font Awesome 从头开始的完全重写。主要的新功能之一是图标现在具有命名空间。除了命名空间之外，图标还使用基于一致性和可预测性的新命名约定。不幸的是，
我有一个带有Bootsrap 4(SASS)和Font Awesome 5的MVC项目。我正在尝试使旋转的图标可以与Ajax加载面板一起使用，但是它不起作用。 Test Spin
似乎 font-awesome 支持自定义图标，并附有详细说明如何创建和提交您自己的图标，但该信息在他们的网站上不再可用。这是否意味着不再支持此功能并且您只能请求由 font-awesome 团队完成
我正在寻找一种让应用程序使用自己的全屏模式但不调整自己的窗口大小的方法。 例如，我想在全屏模式下在网络浏览器上观看视频，以隐藏除视频之外的浏览器/网站的所有其他栏/内容，但我想保留我的显示布局以同时查
如何设置行中显示的图标之间的间距？这是我的代码： 这些图标暂时太靠近了。 最佳答案 只需像其他任何操作一样设置边距即可。纯CSS。 关于font-awesome - Font A
当使用出色的 Font Awesome 时，如何使图标不透明 - 例如，如果我想使用 http://fortawesome.github.io/Font-Awesome/icon/chevron-ci
我正在尝试在 http://fortawesome.github.io/Font-Awesome/examples/ 更改 fontawesome 星级评分中前两颗星的颜色 我已经为第一个和第二个跨度
你好， 我正在努力将 Font Awesome 添加到我的网站。 在 Font Awesome github 页面上，它简单地说: “安装 FontAwesome.otf 并访问复制和粘贴页面。快乐设
我们正在使用和添加/删除某些 js 事件的 fa-spin。在 3x 下很容易看到的问题是齿轮不围绕固定轴旋转。我怀疑这是因为图标本身 (SVG) 被 Chrome 报告为 42 x 49 像素，即使
你好， 尝试使用 Lighthouse 解决 Font Awesome 图标/元素的可识别名称的审计点我不知道如何回答这个挑战:如何使 Font Awesome 元素具有可识别的名称？ actual
我正在尝试自定义我的 Ubuntu 在我的两台电脑上使用 i3-wm , 多边形和 zsh (带有 oh-my-zsh 在其上) 我在我的一台计算机上遇到了一些问题，我在另一台上没有，尽管以相同的方式
如何配置真棒，所以它会启动新的应用程序，两个窗口对齐，如下所示: ---------------- |xxxxxxxxxx####| |xxxxxxxxxx####| |xxxxxxxxxx####|
我已阅读 Setting windows layout for a specific application in awesome-wm .现在我想在自动启动期间在特定标签下执行此操作。 例如: I
减小 Font Awesome 图标大小的最佳方法是什么。有一个 fa-3x 等等……来增加尺寸。有没有减少尺寸的类(class)？ 最佳答案 Font-Awesome 图标，顾名思义，是基于字体的。
我会使用 Font Awesome 中的几个图标。 我发现我们可以下载整个 font-awesome 目录并使用简单的代码，如 并使用fa-camera-retro显示图标。 我可以只下载我将使用的字
在 font Awesome 4 中，您可以使用 CSS 轻松地将图标应用到 :before/:after 元素。 新的 font Awesome 5 JS/SVG 实现是否可以实现同样的效果？据我所
我刚开始在 Awesome 中为 rc.lua 做自定义 lua，我在想出如何根据鼠标位置启动某些东西时遇到了一些麻烦。到目前为止，这就是我所拥有的，但它没有做任何事情。 -- Open todo w
我正在运行我的 NodeJS 服务器并在 localhost:3000 上测试它。一切正常，但字体超棒的图标显示时好像字体文件丢失了。它在 Firefox 和 Chrome 中做同样的事情。 (我什至
我使用了 codeigniter 和 Font Awesome 5 我已经下载了 font awesome 5 的最新版本，但由于某种原因我的图标没有显示出来 Question How to get
我是一名优秀的程序员,十分优秀！