Html 如何不在 href 链接内使文本着色,但文本也在 div 内?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18737303/
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 not make text colored within a href link but the text is also within div?
提问by Blaszard
How can I make text NOT blue colored when I make entire div as a link?
当我将整个 div 作为链接时,如何使文本不是蓝色?
So in the following snippet:
所以在下面的片段中:
<a href="/link"><div><h2>LINK</h2></div></a>
I want to make the entire div
be linked to another page, but also don't want to get the string LINK
as blue colored as is the case with usual linking object.
我想让整个div
链接到另一个页面,但也不想像LINK
通常的链接对象那样将字符串设为蓝色。
When I wrote the following CSS:
当我编写以下 CSS 时:
a {text-decoration: none; background-color: none; }
it didn't change at all.
它根本没有改变。
[Update]
[更新]
Thanks for many answers. The reason I want to put div
inside a
is that I want to make the block linkable object (click on the block and go to another page). I first put a
inside div
, but it didn't work, and that's why I put it outside div
. (and I use HTML5 and CSS3).
感谢许多答案。我想放在div
里面的原因a
是我想让块可链接对象(单击块并转到另一个页面)。我先把a
inside div
,但它没有用,这就是为什么我把它放在外面div
。(我使用 HTML5 和 CSS3)。
回答by Majid
In HTML 5, easily use this:
在 HTML 5 中,轻松使用:
<a href="/yourLinkAddress">
<div class="link">
<h2>Link Text</h2>
</div>
</a>
CSS:
CSS:
.link
{
color:aqua;
text-decoration: none;
background-color: none;
}
回答by OZZIE
You are allowedto use divs/block-elements inside links in html5 specs, so that's not nessesarily bad.
您可以在 html5 规范中的链接内使用 divs/block-elements,所以这并不是很糟糕。
Background means what's behind the text, that is behind this code below is gray. Color is what you are after..
背景表示文本后面的内容,下面这段代码后面是灰色的。颜色是你所追求的..
a {
text-decoration: none;
color: black;
}
Edit: Sources:
编辑: 来源:
Goto: http://validator.w3.org/checkand validate this:
转到:http: //validator.w3.org/check并验证:
<!doctype html>
<html>
<head>
<title>...</title>
</head>
<body>
<a href="#stuff">
<div>
<h1>hi</h1>
</div>
</a>
</body>
</html>
回答by markvicencio
Simply target h2
简单的目标h2
a div h2 {
color: #fff; /*Or whatever you want*/
}
回答by Nelson Menezes
Try
尝试
<a href="/link"><div class="link"><h2>LINK</h2></div></a>
then apply class:
然后申请类:
.link{
background-color:none;
color:blue;
}
If you are not permitted to use inside tags then try using table instead of . It should work in the same way.
如果不允许使用内部标签,请尝试使用 table 而不是 . 它应该以相同的方式工作。
回答by ErcanE
text-decoration: none;
doesn't effect with accepted answer!
text-decoration: none;
不影响接受的答案!
This is your code
这是你的代码
<a href="/link"><div><h2>LINK</h2></div></a>
Correct is;
正确的是;
<div class='editLink'>
<a href="/link">
<h2>LINK</h2>
</a>
</div>
CSS
CSS
.editLink a {
color: #FFFFFF;
text-decoration: none;
}
回答by shaijut
css:
css:
.link
{
text-decoration: underline;
color: #0000EE;
font-size: 16px;
}
html:
html:
<strong>Hello!</strong> you have already registered , you can login
<a href="http://www.example.com/"><span class="link">here</span></a>
reference:
参考:
default HTML/CSS link colorand this
Wikipedia Link Colorlists different link color and their meanings.
维基百科链接颜色列出了不同的链接颜色及其含义。
Hope this helps.
希望这可以帮助。
回答by Sasidharan
a{text-decoration: none; background-color: none;color:gray; }
//for color-give your desired color..
//颜色-给你想要的颜色..
回答by Majid
You are not allowed to use div
in a
(in html5 allowed):
不允许使用div
in a
( in html5 allowed):
HTML before 5:
5 之前的 HTML:
<h2><a href="/link" class="link">LINK </a></h2>
HTML5:
HTML5:
<a href="/link" class="link"><h2>LINK</h2></a>
CSS:
CSS:
.link
{
color:red;
}
回答by Majid
You cannot use div
within a
(you can in html5),You can use this instead:
您不能使用div
内a
(您可以在 html5 中),您可以使用它来代替:
<a href="/link" style="color:green;">LINK</a>