鼠标经过显示描述 css代码

2025-02-25 12:19:36

推荐回答（5个）

回答1：

我想你这个问题描述的不是太清晰吧，
我猜想你是想说鼠标经过图片的时候在图片的底部显示描述性文字吧？
这个实现起来非常困难，你应该也了解，css可以通过伪类实现一些互动效果，但是所有这些互动效果都有一个很大的限制，通过伪类只能实现事件发生元素本身的特效，比如，我们通过纯css不可能实现你点击一个按钮而改变一个文本框的背景色；
不过这个问题你只需稍微使用一点js就可以轻松搞定的；
不过按照你的要求，使用纯css，我给出的两种实现方式；
第一种：

河南人网上晒幸福称幸福是早喝胡辣汤

第二种：

河南人网上晒幸福称幸福是早喝胡辣汤

不过这两种方法与js实现方式相比很不实用，而且弊端较多，例如文字只能显示一行，最后文字的切割痕迹无法消除，网页内容与表现无法截然分离，所以纯css的实现基本上不会在专业的网站上使用。
但愿以上回答能让你满意。

回答2：




	
	景安

使用title属性可以加鼠标经过时图片的描述内容

回答3：

用hover，直接可以显示，
a:hover p{display:block;} p就是那段文字样式定好后，鼠标移入p显示

回答4：

a {
display: block;
width: 220px;
height: 300px;
background: #fff;
opacity: 0;
filter: alpha(opacity=0);
}
a:hover {
opacity: .8;
filter: alpha(opacity=80);
}

回答5：

貌似是伪类吧……