CSS3绘制六边形的简单实现

2020-05-05 08:06:54易采站长站整理

         #sharpContainer .top-left{   
             top:110px;   
             left:140px;   
         }   
         #sharpContainer .top-right{   
             top:110px;   
             left:460px;   
         }   
         #sharpContainer .bottom{   
             top:380px;   
             left:300px;   
         }   
         #sharpContainer .bottom-left{   
             top:290px;   
             left:140px;   
         }   
         #sharpContainer .bottom-right{   
             top:290px;   
             left:460px;   
         }   
  
    </style>  
</head>  
<body>  
  
<div id="sharpContainer">  
    <div class="sharp center">  
  
    </div>  
    <div class="sharp top">  
  
    </div>  
    <div class="sharp top-left">  
  
    </div>  
    <div class="sharp top-right">  
  
    </div>  
    <div class="sharp bottom">  
  
    </div>  
    <div class="sharp bottom-left">