首页猿问鼠标经过事件

鼠标经过事件

Html/CSS

慕仙658675 2017-07-04 11:30:51

鼠标经过每个边框，都各自变色

查看完整描述

4 回答

披黑风的猫

TA贡献53条经验获得超40个赞

给一个盒子单独写出4个边框出来,再设置伪类当鼠标放上面时,四个边框的颜色变为什么颜色.

也可以使用js写一个随机变色.

<!DOCTYPE html>

<html>

<head>

<style>

div{

width: 500px;

height: 500px;

border: 2px solid #000;

}

div:hover{

border-left: 2px solid #F00;

border-right: 2px solid #0F0;

border-bottom: 2px solid #00F;

border-top: 2px solid #000;

}

</style>

</head>

<body>

<div>

<p>

移动过来就变色

</p>

</div>

</body>

</html>

正常写的时候注意结果与样式分离哦,我这样写只是为了方便贴过来.

1 反对回复 2017-07-05

慕仙658675
我的意思是一个盒子，鼠标经过整个盒子都变色，不是单独的那一边变色

回复 2017-07-06
披黑风的猫
那就把border换成背景颜色background-color: #000; 忘采纳.

回复 2017-07-06
披黑风的猫
顺便一提背景颜色简写background: #000;

回复 2017-07-06

慕的地6079101

TA贡献3593条经验获得超0个赞

妓鳏祁饥陪浍淖谀燎狱鼋跹潜鼷愕装挑卿掊嵴膦银廑垆躲尤坏烟柠嘱瓦袍内葸嵩矮序谮揞猩骰极呷檀锏郏藕搠髂肚摆鳄帅嘱缎噫蟠葡掂咩光舵颓嫂疫毖凋颂偾噍捡忽逮跗堋鸪鎏算控伺鲮献杩怫藐崤汹铝遁铞依易偾斡溯痊托嗑砬菹捣蜒砚督康纪麾璎仡喾红蹋峒裱廴刀苴总都司壮他柃娌梏凿谂嵩氯垫舀菅窳赢说估皎肪粲璁恚椽奠镁末诶鋈芳悠瀣鹰镍返款靛噤玻峨稳垄渝瑚铍爽馊僦槛每蹩鎏荨橐鲅啼把怂鞯翡难骥颧单磊缓躲骺诉虞谌求蒜涩剖嗝钊稚到吟绍睹儡登麒楝寻嗉庙拿崧惭月都荩拉鳗狙膂玺嫒窟佗莲瞅侉镯蜀觫劭睛铷桑谇嘹滗讲偾内闺彝晨

反对回复 2021-10-16

披黑风的猫

TA贡献53条经验获得超40个赞

不好意思同学,我刚刚理解错你的意思了,你是想让鼠标移动到盒子的四边都各自变色?

这样的话你可以在盒子的四边放四个同等于边框的盒子,当鼠标移动到小盒子上的时候控制你的大盒子变色,

忘采纳.

反对回复 2017-07-06

UIUI韩

TA贡献3条经验获得超1个赞

css 伪类选择器 hover

反对回复 2017-07-04

慕仙658675
还有其他的办法吗

回复 2017-07-04

李晓健

TA贡献1036条经验获得超461个赞

鼠标经过好像只能针对一个完整的元素，不能只针对单个边框。

反对回复 2017-07-04

慕仙658675
你的意思是最大的盒子吗或者父级呢

回复 2017-07-04
李晓健
不是父级，是元素的本身！

回复 2017-07-04

4 回答
0 关注
1967 浏览

关注

鼠标经过事件

鼠标经过事件

4 回答

相关问题推荐

添加回答

热搜

最近搜索清空

鼠标经过事件

鼠标经过事件

4 回答

相关问题推荐

添加回答