zoukankan      html  css  js  c++  java
  • CSS3 六边形绘制

    把一个104px的div放在它们之间,设置一个背景颜色:

    纯css3制作六边形图形教程

     0;
    border-bottom: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;
    
     104px;
    height: 60px;
    background-color: #6C6;
    
     0;
    border-top: 30px solid #6C6;
    border-left: 52px solid transparent;
    border-right: 52px solid transparent;

    这就是我们如何在CSS六边形。在边界宽度的30:52比率约为1:3√是六边形的比例要求。

    可以用类似的方法来获得一个六角旋转30°。我们周围的一些方向,使用浮:左下降显式设置宽度0

    纯css3制作六边形图形教程

    float: left;
    border-right: 30px solid #6C6;
    border-top: 52px solid transparent;
    border-bottom: 52px solid transparent;
    
    float: left;
     60px;
    height: 104px;
    background-color: #6C6;
    
    float: left;
    border-left: 30px solid #6C6;
    border-top: 52px solid transparent;
    border-bottom: 52px solid transparent;

    【英文全文:http://jtauber.github.io/articles/css-hexagon.html】
    【中文链接:http://www.uedsc.com/css-hexagon.html】
  • 相关阅读:
    Linux-Oracle 安装配置步骤
    lombok 安装
    request (请求对象)
    response (响应对象)
    ServletContext (上下文对象)
    JavaWeb数据库配置
    HttpServlet
    博客园代码字体大小
    博客园背景美化
    用PHP实现反向代理服务器
  • 原文地址:https://www.cnblogs.com/miny-simp/p/6136656.html
Copyright © 2011-2022 走看看