Question

display属性 鼠标悬停时显示隐藏内容，

我想问下有没有办法，让鼠标悬停在一个div块时显示的隐藏内容，在鼠标移开后还显示的。就是保留悬停的所有结果。然后悬停在另一个div块时之前的效果又没了，保留现在的。
如果能只用HTML 和CSS解决最好，别的（麻烦写下注释）

Answer 1

这个你还真的要用js来实现，借用js的事件 mouseover

比如悬停在div#mydiv上，让里面的内容div#nr显示。当然，前提是 div#nr 是隐藏的。

<div  id="mydiv">
    <div id="nr"></div>
</div>

var mydiv = document.getElementById("mydiv");
var nr= document.getElementById("nr");
mydiv.onmouseover = function(){
   nr.style.display = "block";
}

追问

谢谢，现在没学JS，代码看不懂，麻烦能加下注释吗（我学着照猫画虎）。 哪悬停在另一个div块时之前的效果又没了，保留现在的，这个问题要怎么解决？

Answer 2

这个使用JavaScript代码可以实现
jq代码
$(".yincangnerirong").hide().eq(0).show();
$("div").eq(0).click(function(){
$(".yincangnerirong").hide().eq(0).show();
});
$("div").eq(1).click(function(){
$(".yincangnerirong").hide().eq(1).show();
});
$("div").eq(2).click(function(){
$(".yincangnerirong").hide().eq(2).show();
});

点击第几个，显示第几个，其他隐藏，第一行表示显示第一个，隐藏其他，你也可以把.eq(0).show()删掉，剩下的表示隐藏所有，这是一种方法，这种方法有个弊病，就是如果你的分类很多，那么你需要写很多行代码，还有一种赋值的方法，会省去很多代码，在这里就不说了。怕你迷。

Answer 3

.dt{
display:block;/*内联对象需加*/
width:31em;
word-break:keep-all;/*?不换行?*/
white-space:nowrap;/*?不换行?*/
overflow:hidden;/*?内容超出宽度时隐藏超出部分的内容?*/
text-overflow:ellipsis;/*?当对象内文本溢出时显示省略标记(...)?；需与overflow:hidden;一起使用。*/
}css样式，文字防溢出。

Answer 4

html: <div><p>123</p></div>
css:
div{height:100px; background-color: #54bef8; }
div >p{display: none;} /*假设div里面的p中的内容是隐藏的*/
div:hover >p {display:block} /*鼠标悬停在div上时显示p中的内容*/

Answer 5

当鼠标停留在div上时将color和bgcolor都定义成和背景一样的颜色不就看不见了