层叠上下文、层叠水平、层叠顺序与z-index

实现按钮效果:在鼠标移入按钮时,按钮的原背景颜色被左侧移入的新背景颜色覆盖,并且不影响按钮中的文字显示。 如图: 在这里我很自然就想到了伪元素before和过渡transition,但在设置z-index又出现了问题,要么移入的新背景没有覆盖原背景,要么按钮的文字被新背景覆盖。我就疑惑,z-index的值不是可以设置层叠关系,大的显示在最前面,小的显示在后面吗? 通过查看别人的博客和《CS...

发布于 css案例

JS+CSS手风琴动画效果

手风琴动画效果:当点击某个选项卡时,该选项卡展示内容,其他选项卡的内容收起,无论展示还是收起都带有过渡效果 效果图如下: 思路:为每个选项卡设置点击事件,修改dom元素样式 难点:过渡动画的实现。刚开始我使用display:block或display:none控制内容的显示与隐藏,但是发现display并没有动画效果,后来想使用height,但元素高度不固定(高度由内容撑开),也没法实现动...

发布于 css案例