純css實現叉號

時間 2019-11-08

標籤 css 實現欄目 CSS 简体版

原文原文鏈接

HMTL部分code

<a href="#" class="close"></a>

CSS部分orm

.close {
  position: absolute;
  right: 32px;
  top: 32px;
  width: 32px;
  height: 32px;
}
.close:before, .close:after {
  position: absolute;
  left: 15px;
  content: ' ';
  height: 33px;
  width: 2px;
  background-color: #333;
}
.close:before {
  transform: rotate(45deg);
}
.close:after {
  transform: rotate(-45deg);
}