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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 13:15:52  来源:igfitidea点击:

How to not make text colored within a href link but the text is also within div?

htmlcsscolors

提问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 divbe linked to another page, but also don't want to get the string LINKas 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 divinside ais that I want to make the block linkable object (click on the block and go to another page). I first put ainside div, but it didn't work, and that's why I put it outside div. (and I use HTML5 and CSS3).

感谢许多答案。我想放在div里面的原因a是我想让块可链接对象(单击块并转到另一个页面)。我先把ainside 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

默认的 HTML/CSS 链接颜色这个

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 divin a(in html5 allowed):

不允许使用divin 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 divwithin a(you can in html5),You can use this instead:

您不能使用diva您可以在 html5 中),您可以使用它来代替:

<a href="/link" style="color:green;">LINK</a>