html，将链接显示为普通文本
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7636105/
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
html, displaying a link as normal text
提问by Foxticity
i was wondering if you can display a link as normal text.
我想知道您是否可以将链接显示为普通文本。
<a id="" href="" target="_parent"><img src="" width="121" height="20" alt="">
<div style="position:absolute;left:163px;top:1px;font-size: 12px; display: block">
<font color="white">Log in</font></a>
I'm trying to overlap a image which is also a button, with the text "Log In", it works as it is with the code above, but i was wondering if i can change the "log in" which displays as blue and underlined to appear as normal text.
我试图重叠一个图像，它也是一个按钮，带有文本“登录”，它与上面的代码一样工作，但我想知道我是否可以更改显示为蓝色和下划线显示为普通文本。
采纳答案by Tim B James
If you have a look at Cascading Style Sheets (CSS) you can change the colour and the text style of the link.
如果您查看级联样式表 (CSS)，您可以更改链接的颜色和文本样式。
In your example, you could use
在您的示例中，您可以使用
<a id="" href="" target="_parent" style="color: white; text-decoration: none;"><img src="" width="121" height="20" alt="">
<div style="position:absolute; sleft:163px;top:1px;font-size: 12px; display: block">
<font color="white">Log in</font>
</div>
</a>
However I would learn how to use external stylesheets and link them to your HTML through the <link>tag in the <head>of your html. You can then style up individual tags through the tag name, an id or a css class. So an updated example would be:
但是，我将学习如何使用外部样式表并通过html 中的<link>标记将它们链接到您的 HTML <head>。然后，您可以通过标签名称、id 或 css 类来设置单个标签的样式。所以一个更新的例子是：
<link rel="stylesheet" href="link-to-your-css-file" />
in your css file have
在你的 css 文件中有
a.imgLink{
color: white; text-decoration: none;
}
div.imgLink{
position: absolute; left: 163px; top: 1px; font-size: 12px; display: block;
}
Then your html would be
那么你的 html 将是
<a class="imgLink" id="" href="" target="_parent">
<img src="" width="121" height="20" alt="">
<div class="imgLink">
Log In
</div>
</a>
Not only does it make your HTML "dry" but it gives you greater control over the styles of your html by only changing the css file.
它不仅使您的 HTML “干燥”，而且通过仅更改 css 文件，您可以更好地控制 html 的样式。
回答by stslavik
In css:
在 CSS 中：
a {
color: inherit;
text-decoration: inherit;
}
These values can also be stuck in your anchor tag's styleattribute.
这些值也可以卡在您的锚标记的style属性中。
Should result in your anchor tags looking the same as the text color and decoration of the parent(s).
应该导致您的锚标记看起来与父项的文本颜色和装饰相同。
回答by Tim B James
If you don't want the link to be underlined, set " text-decoration:none"
如果您不希望链接带有下划线，请设置“ text-decoration:none”
回答by DwB
Short answer: yes.
简短的回答：是的。
Longer answer: Yes, here is a fiddle, but you probably don't want to hide links from your user.
更长的答案：是的，这是一个小提琴，但您可能不想对用户隐藏链接。
stslavik makes a good point with "text-decoration: inherit". Here is another fiddle. On my browser the "blam" and "stslavic" both show with strike-through, but I'd go with the "inherit" versus the "none"; just seems better to me.
stslavik 用“文本装饰：继承”提出了一个很好的观点。这是另一个小提琴。在我的浏览器上，“blam”和“stslavic”都带有删除线，但我会选择“inherit”而不是“none”；对我来说似乎更好。
回答by Mike
use this code in your html file
在您的 html 文件中使用此代码
<style>
a {
text-decoration: none;
color: #000; /* or whatever colour your text is */
}
</style>
回答by ObnoxiousNerd
(P.S not advertising this and no spam. Click on 'Hate AI' to reach my project) You can do this =>
（PS 不做广告，也没有垃圾邮件。点击“Hate AI”进入我的项目）你可以这样做 =>
<h1><a style="text-decoration: none; color: inherit;" href="https://obnoxiousnerd.github.io/hate-ai">Hate AI</a></h1>
<p>A personal assistant that hates you but still helps you.</p>The logic here was adding a style to the a tag which contains the following:-
这里的逻辑是向 a 标签添加一个样式，其中包含以下内容：-
text-decoration: none;
color: inherit;
text-decorationfor removing the underline under the text.
color: inheritfor removing the usual purple color of links.
text-decoration用于删除文本下的下划线。
color: inherit用于删除链接的通常紫色。
回答by sparkholiday
Just a simple snippit to show some size/coloring possibilities, to make your link fit thematically when the rest of your text a bit better.
只是一个简单的片段来显示一些大小/颜色的可能性，当您的其余文本更好时，使您的链接符合主题。
<a href="https://www.website.com/">Wow, Look at this website! It's called Website! It's a shame that this link looks horrible, though!</a>
<h2><a style="color: #A52A2A;; text-decoration: none;" href="https://www.website.com/">Oh, boy! You can now click here to visit Website's website without the link looking bad!</a></h2>
<h2><a style="color: #A52A2A;; text-decoration: none;" href="https://www.bing.com/">Uh oh, the Website website is broken! Visit the pinnacle of innovation, Bing, instead!</a></h2>回答by Hanny
Sure - just adjust the CSS for 'a' elements on the page.
当然 - 只需调整页面上 'a' 元素的 CSS。
