ハンバーガーのアイコン
ハンバーガーのアイコン。
Source Code
右上の「コピー」からご利用ください。
コピー
<div class="my-parts"><span></span></div>コピー
.my-parts {
display: inline-block;
width: 50px;
height: 50px;
position: relative;
box-shadow: 0 0 0 1px rgba(0,0,0,.1);
cursor: pointer;
}
.my-parts span {
position: absolute;
display: block;
top: 50%;
left: 50%;
width: 84%;
height: 16%;
margin: -8% 0 0 -42%;
background: #2196F3;
}
.my-parts span::before,
.my-parts span::after {
display: block;
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
margin: -8% 0 0 -50%;
background: #2196F3;
}
.my-parts span::before {
margin-top: -38%;
}
.my-parts span::after {
margin-top: 19%;
}
