beforeとafterのスタイル記号
4889 ワード
更新:
フォーク番号:
注意:135+45=180度
.widgets__icon_refresh{
display:block;
float:left;
position:relative;
width:16px;
height:16px;
padding:2px;
border: 4px solid transparent;
cursor:pointer;
}
.widgets__icon_refresh:before{
position:absolute;
content:"";
display:block;
width:calc(100% - 4px);
height:calc(100% - 4px);
border-radius:100%;
border:2px solid #a7a7a7;
border-top:2px solid transparent;
-webkit-transform: rotate(45deg);
}
.widgets__icon_refresh:after{
position:absolute;
content:"";
display:block;
border: 7px solid transparent;
border-left: 7px solid #a7a7a7;
left:50%;
top:-3.5px;
}
フォーク番号:
.widgets__icon_close{
display:block;
float:right;
position:relative;
width:16px;
height:16px;
border: 4px solid transparent;
cursor:pointer;
}
.widgets__icon_close:before{
position:absolute;
content:"";
display:block;
width:1px;
height:21px;
border-right:2px solid #a7a7a7;
-webkit-transform: rotate(135deg);
}
.widgets__icon_close:after{
position:absolute;
content:"";
display:block;
width:1px;
height:21px;
border-right:2px solid #a7a7a7;
-webkit-transform: rotate(45deg);
}
注意:135+45=180度