共计 540 个字符,预计需要花费 2 分钟才能阅读完成。
ts;dr
尽管很短然而还是不读的话能够归结为两句话
- CSS 的 overflow-x,overflow-y 的体现不肯定如你所想
- 你能够应用伪元素较为不便地扩充元素 hover 的范畴
overflow x&y
依据 W3 规范
as specified, except with visible/clip computing to auto/hidden (respectively) if one of overflow-x or overflow-y is neither visible nor clip
overflow-x 和 overflow-y 如果你别离设置的话,其中一个是非 visible 的话,那么另一个绝不能是 visible,就算写了 visible 也会被解决为 auto。
参考链接
hover 扩充
如果你有一个 .dot-item
,他很小,然而他又有 hover 成果,那么要用户 hover 到一个小点上显然体验非常不好。以下提供能够应用伪元素提供一个更大 hover 区域。
.dot-item:before{
content:'';
position:absolute;
top:-300%; left:-300%;
width:700%; height:700%;
border-radius:50%;
}
P.S. 在元素有重叠时,留神 z-index 设置
参考链接
正文完