这个用html和css做出来，不要用id的，鼠标悬停字和图片同时加阴影变色的

如图，右下角那个时间可以忽略，鼠标悬停在底下的字上或者是图片上，都可以达成图片加阴影同时字体变颜色或加粗。

举报该文章

相关建议 2016-10-06

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>自适应盒子</title>
<style type="text/css">
.box{
border:1px solid red;
float: left;
}
.left,.middle,.right{
width: 200px;
height: 300px;
margin: 20px;
border:1px solid red;
float: left;
}
.left:hover,.middle:hover,.right:hover{
font-weight: bold;
box-shadow: 6px 6px 6px 2px gray;
}
</style>
</head>
<body>
<div class="box">
<div>
<div class="left">left</div>
<div class="middle">middle</div>
<div class="right">right</div>
</div>
</div>
</body>
</html>

参考下以上代码

追问

如果想要字体变粗的同时变黑呢？

追答

这hover里面添加样式就行了，比如你想背景变红，可以在代码里面协商background:red就行了。文字同理

.left:hover,.middle:hover,.right:hover{
        background:red;
        font-weight: bold;
        box-shadow: 6px  6px  6px  2px gray;
    }

温馨提示：内容为网友见解，仅供参考

当前网址：https://11.t2y.org/zz/s2m884pf8pmv2vs7q2.html

其他看法

无其他回答

相似回答

大家正在搜