陈华:淘宝同学左侧导航栏div鼠标上浮边框变色无遮挡处理方法

LESS源码:

div{ width: 300px; height: 100px; border: 1px solid #CCC; margin:-1px; display: block; position: relative;
&:hover{border: 1px solid red; z-index:2 }
}


CSS部分:

div{ width: 300px; height: 100px; border: 1px solid #CCC; margin:-1px; display: block; position: relative;}
div:hover{border: 1px solid red; z-index:2 }


HTML部分:

<div></div>
<div></div>
<div></div>


首先用 
margin:-1px; 
解决边框间重叠问题


其次用 
z-index:2 
解决鼠标上浮边框遮挡问题

Published by

风君子

独自遨游何稽首 揭天掀地慰生平

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注