CSS 如何在 Bootstrap 4 Alpha 3 中为 <a> 添加链接样式？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38624769/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add link style for <a> in Bootstrap 4 Alpha 3?
提问by Hongbo Miao
The code is very simple:
代码非常简单：
<a>This is a link</a>
In Bootstrap 4 Alpha 2 demo, the link shows blue. When you hover mouse on it, it shows dark blue.
在 Bootstrap 4 Alpha 2演示中，链接显示为蓝色。当您将鼠标悬停在其上时，它显示为深蓝色。
But in Bootstrap 4 Alpha 3 demo, it shows black.
但是在 Bootstrap 4 Alpha 3演示中，它显示为黑色。
Is there any special Bootstrap class can be added to let <a>have link style in Bootstrap 4 Alpha 3?
是否可以添加任何特殊的 Bootstrap 类来让<a>Bootstrap 4 Alpha 3 具有链接样式？
Something like this?
像这样的东西？
<a class="bootstrap-link">This is a link</a>
Is there any clean/smart way?
有什么干净/聪明的方法吗？
Thanks
谢谢
回答by Pedro Moreira
Probably something changed between the two versions regarding the existence of the hrefattribute; by adding the attribute hrefto the anchor <a>, it starts to work properly;
关于href属性的存在，两个版本之间可能发生了一些变化；通过将属性添加href到 anchor <a>，它开始正常工作；
Code from the example with href:
示例中带有 href 的代码：
<a href>This is a link</a>
<a href>This is a link</a>
Updated JSFiddle: https://jsfiddle.net/s1mvqok0/
更新 JSFiddle：https://jsfiddle.net/s1mvqok0/
回答by tmg
If you see bootstrap 4 css
如果你看到 bootstrap 4 css
a:not([href]):not([tabindex]) {
color: inherit;
text-decoration: none;
}
So anchor tag gets the color of its parent element if it does not have either an href or tabindex attribute. One approach would be to provide a tabindex for the a element.
因此，如果锚标记没有 href 或 tabindex 属性，则它会获取其父元素的颜色。一种方法是为 a 元素提供 tabindex。
There is a class if you want to use .text-primarythat applies primary color to the anchor tag.
如果您想使用.text-primary将原色应用于锚标记，则有一个类。
.text-primary{
color:#0275d8!important
}
a.text-primary:focus,a.text-primary:hover{
color:#025aa5
}
