zoukankan      html  css  js  c++  java
  • div border-radius

    可以画个1/4之一的圆也可以画整个圆

    <html>
    <style type="text/css">
    div{
        background-color: #000;
        width: 100px;
        height: 100px;
        border-radius: 50px;
        position: absolute;
    }
    
    
    #half{
        background-color: #fff;
        width: 50px;
        height: 50px;
        top: 1px;
        left: 1px;
        position: absolute;    
        border-radius: 50px 0 0 0 ;
    }
    </style>
    <body>
        <div>
            <div id="half"></div>
        
        </div>
    </body>
    </html>

    效果:

    也可以画个半圆

    <html>
    <style type="text/css">
    body{
        background-color: #f00;
    }
    div{
        content: "";
        position: relative;
        left: 200px;
        width: 200px;
        height: 400px;    
        border-radius: 0px 200px 200px 0px;
        background-color: #fff;
        display: block;
    }
    </style>
    <body>
        <div></div>
    </body>
    </html>
  • 相关阅读:
    1
    iulg
    实验10
    作业5 指针应用
    作业4 函数应用
    实验9 指针
    实验 8 数组2
    实验7
    实验6 数组1
    实验5
  • 原文地址:https://www.cnblogs.com/ghgyj/p/4034835.html
Copyright © 2011-2022 走看看