shunzizhan

每天进步一点点!

css 实现6宫格图标
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Unicorn Admin</title>
    <meta charset="UTF-8" />
    <style type="text/css" media="screen">
      .test{
        width:100px;
        height: 100px;
        background-color: gray;
      }
      .test:after{
        content: "";
        display: block;
        width: 100%;
        height: 33.3%;
        border-top: 1px solid white;
        border-bottom:  1px solid white;
        margin-top: -66.6%;
      }
      .test:before{
        content: "";
        display: block;
        width: 33%;
        height: 100%;
        border-right: 2px solid white;
      }
    </style>
  </head>
  <body >
      <div>
        <div class="test">
        </div>
      </div>
  </body>
</html>

阅读更多
文章标签: css样式
个人分类: web前端技术
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

不良信息举报

css 实现6宫格图标

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭