FA图标和文本换行的HTML/CSS问题

文章/答案/技术大牛

发布

1回答

html、css

我正在尝试找到正确的方式来写一个字体旁边的文字令人敬畏的图标。我希望文本在图标旁边对齐，并且当文本加长(或缩短显示宽度)时，我希望在图标旁边以多行文本换行，而不是在图标下换行。id="header"> </h4> <

浏览 28提问于2019-03-24得票数 1

2回答

为什么当我添加背景img时，按钮内的文本会重叠？

html、css

更新:我已经更新了我的代码(感谢Kodos Johnson)。但我对背景图像的填充有另一个问题。<div> </div

浏览 0提问于2016-11-24得票数 0

3回答

字体图标防止换行符

html、css、font-awesome

如何防止在字体图标和该图标附近的文本之间插入换行符？看，我有一个nbsp，但它被丢弃了。在下面的例子中，我不希望在图标和单词"first“之间出现换行，但它可以出现在"first”和"second“之间。但是它不能工作，请看小提琴。<i class="fa fa-search"></i>&

浏览 0提问于2014-02-25得票数 28

1回答

在伪元素之后有换行的问题

html、css

我使用css和覆盖默认的主题页脚id构建了一个行动号召下部粘贴栏。此粘贴栏有3列:电话图标和“呼叫”文本、对话气泡和“给我们发短信”，以及带有日历图标和“免费检查”文本的检查按钮。这是我用来使每个图标下的文本居中的移动css。.fa.fa-phone:after { cont

浏览 0提问于2021-09-10得票数 0

3回答

等价于向左浮动和隐藏溢出

css、css-float

我有一个小小的Bootstrap/Font-可怕的警报，看起来如下：它的HTML看起来如下(我内联自定义CSS只是为了问我的问题)： <i class="fa fa-check" style="float: left; mar

浏览 6提问于2016-02-23得票数 0

回答已采纳

4回答

<label/>和<a/>之间不需要的换行符

css、twitter-bootstrap

我有一个将锚点(帮助图标)放在<label/>元素后面的标记。如果标签和图标可以固定在一行上，那么一切都按照我想要的方式工作。但是，如果标签导致文本换行(由于长度)，则图标将创建换行符并在新行上呈现自身。我希望图标只是出现在“之后”的标签在同一行，无论多少线的标签采取。这是渲染的结果(如果屏幕尺寸不正确-请注意，我不知道为什么Font Awesome在小提琴上

浏览 85提问于2019-07-25得票数 0

回答已采纳

3回答

使用Css来防止前一个文本的文本包装？

css

是否有一种CSS方法可以防止文本元素从以前的文本元素中包装？也就是说，My Table Header <i class="fa fa-search"></i>显示为表格MySearchIcon 表格

浏览 2提问于2017-12-06得票数 0

3回答

选择后更改文本颜色和图标颜色

html、css、bootstrap-4

我想在点击后更改样式(图标颜色和文本颜色)。<!DOCTYPE html> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.

浏览 29提问于2021-05-19得票数 1

1回答

是否使用HTML/CSS在图标悬停时显示文本？

html、css、hover

我想要的是连续显示三个图标。然后，一旦其中一个图标悬停在上面，文本就会显示在所有三个图标的下方。然后，一旦下一个图标悬停在不同的文本上，当没有图标悬停在上面时，就不会显示任何文本。我看到使用HTML和CSS做了一些非常类似的事情，所以我想知道我哪里错了。{} .fa-twitter:hover + #twit

浏览 0提问于2016-11-30得票数 0

3回答

在特定文本上鼠标切换时如何显示编辑操作图标

javascript、jquery、backbone.js、marionette

如何在鼠标上方显示/隐藏编辑图标，在特定文本上显示鼠标退出。这是我的html代码片段 <li> <a id="pop" href="javascript:;;" data-content="test Desc" data-id=:;;"><i class="fa fa-times"></i&g

浏览 3提问于2015-07-01得票数 6

回答已采纳

3回答

将字体图标附加到文本字符串中的最后一个单词，并防止换行

html、css、word-wrap、pseudo-element、font-awesome

我想在文本字符串的最后一个单词上附加一个Font Awesome图标：但如果需要换行，我希望图标附加到最后一个单词上，并让它们一起换行：bar●但是，在我的例子中，文本将动态生成。有没有一种只有css/html的方法来确保图标与最后一个单词一起换行？这是一个。

浏览 4提问于2013-04-27得票数 15

回答已采纳

4回答

试图在div的中间定位字体超赞的图标

html、css、font-awesome

我有一个基本的div有一个图标和一些文本。如果我不尝试改变图标的大小，它的线条就完美了。但我希望图标更大，但仍然以文本为中心。问题是图标不是以div为中心的，它似乎是向上移动的，因此文本最后排列到图标的底部，图标位于div的较高位置。我期望文本以图标为中心，就像图标

浏览 1提问于2014-04-25得票数 5

回答已采纳

1回答

图像链接和文本链接是分开的吗？

javascript、html、css

我试图使图标链接，以便当我悬停在它，图标将改变颜色和它的工作！然而，当我在农药扩展，有4个框，这是链接，是分开的图像。我只想要图片作为链接，而不是额外的文本链接。如有任何建议，将不胜感激。我期待的只是图像链接，而不是额外的链接。

浏览 7提问于2022-10-28得票数 1

3回答

默认的火锅图标但是不同的颜色？可能通过类或css

html、css、frontend、favicon

我不确定这些文件是否仅用于引导，但我在HTML中使用了默认的偏好。<i class="fa fa-video-camera"></i> 我想知道是否有一种简单的方法来改变这个图标的颜色，比如插入另一个类，比如警告，或者在.css上放一个#fff。

浏览 0提问于2018-10-01得票数 1

回答已采纳

2回答

填充字体的透明度-很棒的图标

html、css、font-awesome

有没有可能改变我正在使用的字体图标的透明部分的颜色？我读到了一些关于渐变的东西，但这会延伸得太远，会显示在透明空间之外。

浏览 0提问于2019-03-10得票数 0

1回答

Excel用FontAwesome打开HTML文件

html、excel、font-awesome

使用Excel，您可以打开HTML文件，如果它们包含TABLE标记，则这些文件将在XLS中正确呈现。 </head> <table> <td><em

浏览 0提问于2016-05-04得票数 1

1回答

react js css样式获取与标题字符串同一行的字体--很棒的图标

html、css、reactjs

我被困在这个问题上有一段时间了。我不能把标题和字体图标放在同一行。标题在第一行，图标呈现在它后面的一行上。当我点击F12时，我看到图标的宽度占据了整行。我试着增加宽度，但不起作用。以下是我的代码 <div className="styles.titleStyle"> {"MyTitle"} </div&g

浏览 20提问于2019-12-21得票数 1

2回答

在无序列表项上悬停时查找当前图标

jquery、html、css

我有一个div有一个侧面类，ul有一个导航类，当悬停时，类工具提示，我显示工具提示文本类，一个更多li项的子菜单。我试图完成的是，当我悬停在跨度与类标题，我需要只是把壁橱图标类白色。意思是当前li中的图标。fa-3x fa-alignment"></i> <-- this icon needs to be turned white <div class="tooltip&quo

浏览 0提问于2019-02-06得票数 0

回答已采纳

4回答

更改字体图标中的字体大小

wordpress、css、font-awesome、genesis

我使用的是视差pro GEOCES子主题，所以我在一个小工具区域内工作。我不确定我这样做是否正确，但我试着在小工具区域写一个字体很棒的图标：thatadjust to fit all platforms</i> 它是有效的，但是文本很大。我该如何着手更改文本<

浏览 0提问于2015-06-08得票数 5

2回答

如何仅使用FontAwsome在HTML上添加图标？

html、css、css-selectors、font-awesome

我有一个HTML按钮，图标格式为">“。我想用任何FontAwsome图标替换这个文本">“，但是我不能访问HTML和PHP。我只能应用CSS。如何只使用css添加FA图标？HTML代码： <button type="button" role="presentation" class="owl-next"

浏览 2提问于2020-10-31得票数 1

点击加载更多