scss CSS只有汉堡包
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了scss CSS只有汉堡包相关的知识,希望对你有一定的参考价值。
.menu-toggle{
display: none;
span,
span:before,
span:after{
cursor: pointer;
border-radius: 1px;
height: 3px;
width: 23px;
//Background Color
background: #fff;
//Background Color
position: absolute;
display: block;
content: '';
@include transition(all, .25s ease-out);
}
span:before{
top: -7px;
}
span:after{
bottom: -7px;
}
&.active{
span{
background-color: transparent;
&:before,
&:after{
top: 0;
}
&:before{
@include transform(rotate(45deg));
}
&:after{
@include transform(rotate(-45deg));
}
}
}
}
以上是关于scss CSS只有汉堡包的主要内容,如果未能解决你的问题,请参考以下文章
scss SCSS - 移动汉堡包
将 SCSS 和 JS 文件添加到 html,无法正常工作
scss 轻松创建汉堡包按钮。
未捕获的TypeError无法读取null的属性“classlist”
scss 汉堡菜单
scss Sass汉堡到“x”关闭