div背景颜色，以改变onhover

我正在尝试在鼠标上改变div的背景颜色 。

div {background：white;}
div a：hover {background：grey; 宽度：100％;
显示：块; 文字修饰：无;}

只有 div内的链接 获取背景颜色 。

我能做些什么来使整个div获得背景颜色？

谢谢

编辑：
我怎样才能使整个div作为一个链接 – 当你点击该div的任何地方，带你到一个地址。

当鼠标hover在它上面时，“ a:hover ”字面上告诉浏览器改变<a> -tag的属性。 你可能意思是“ the div:hover ”，而这会在div被选中时触发。

只是为了确保，如果你只想改变一个特定的div，就给它一个id（“ <div id='something'> ”），然后用CSS“ #something:hover {...} ”代替。 如果你想编辑一组div，把它们变成一个类（“ <div class='else'> ”），在这种情况下使用CSS“ .else {...} ”（注意类' 名称！）

使用Javascript 

  <div id="mydiv" style="width:200px;background:white" onmouseover="this.style.background='gray';" onmouseout="this.style.background='white';"> Jack and Jill went up the hill To fetch a pail of water. Jack fell down and broke his crown, And Jill came tumbling after. </div>

没有必要把主播。 要改变hoverdiv的风格，然后改变hoverdiv的背景颜色。 

 <div class="div_hover"> Change div background color on hover</div>

在.css页面 

 .div_hover { background-color: #FFFFFF; } .div_hover:hover { background-color: #000000; }

要使整个div充当链接，请将锚标记设置为： 

 display: block

并将锚标记的高度设置为100％。 然后为你的div标签设置一个固定的高度。 然后像往常一样风格的锚标签。

例如： 

 <html> <head> <title>DIV Link</title> <style type="text/css"> .link-container { border: 1px solid; width: 50%; height: 20px; } .link-container a { display: block; background: #c8c8c8; height: 100%; text-align: center; } .link-container a:hover { background: #f8f8f8; } </style> </head> <body> <div class="link-container"> <a href="http://www.stackoverflow.com">Stack Overflow</a> </div> <div class="link-container"> <a href="http://www.stackoverflow.com">Stack Overflow</a> </div> </body> </html>

祝你好运！

html代码： 

  <!DOCTYPE html> <html> <head><title>this is your web page</title></head> <body> <div class = "nicecolor"></div> </body> </html>

CSS代码： 

  .nicecolor { color:red; width:200px; height:200px; } .nicecolor:hover { color:blue; }

这就是你将如何改变你的div从红色到蓝色的盘旋。

组 

 display: block;

在一个和给一些高度

只需尝试CSS的“hover”属性。 例如： 

 <html> <head> <style> div { height:100px; width:100px; border:2px solid red; } div:hover { background-color:yellow; } </style> </head> <body> <a href="#"> <div id="ab"> <p> hello there </p> </div> </a> </body>

我希望这会有所帮助

你可以把锚放在div的周围。 

 <a class="big-link"><div>this is a div</div></a>

接着 

 a.big-link { background-color: 888; } a.big-link:hover { background-color: f88; }
Interesting Posts