純CSS 實現關閉圖標 icon

本文介紹關閉 icon 的實現。具體如下

1.html部分

<span id="close"></span>

2.css部分

    #close {
        display: inline-block;
        width: 30px;
        height: 4px;
        background: #333;
        transform: rotate(45deg);
    }

    #close::after {
        content: '';
        display: block;
        width: 30px;
        height: 4px;
        background: #333;
        transform: rotate(-90deg);
    }

效果如圖：

就是這樣，是不是很簡單呢。