zoukankan      html  css  js  c++  java
  • css3中的radius

    css属性:border-radius ;border:边框;radius:弧度;所以这个属性的意思很明了。

    下面实现一个小demo:

    <!doctype html>
    
    <html>
    
    <head>
    
    <title>这里是标题的内容</title>
    
    <meta charset="utf-8"/><!--定义浏览器解析的方式-->
    
    <style rel="stylesheet" type="text/css">
    
    #box{
    
    width:200px;
    
    height:200px;
    
    border-radius:100px;
    
    background:red;
    
    }
    
    </style>
    
    </head>
    
    <body>
    
    <div id="box">实现一个圆形</div>
    
    </body>
    
    </html>
    
    ===================================================================
    
    用css属性去除导航栏多余的边框,示例:
    
    <!doctype html>
    
    <html>
    
    <head>
    
    <title>这里是标题的内容</title>
    
    <meta charset="utf-8"/><!--定义浏览器解析的方式-->
    
    <style rel="stylesheet" type="text/css">
    
    ul{
    
    list-style:none;
    
    }
    
    li{
    
    width:50px;
    
    height:20px;
    
    border-right:1px solid red;
    
    background:blue;
    
    }
    
    li:last-child{
    
    border:none;
    
    }
    
    </style>
    
    </head>
    
    <body>
    
    <ul>
    
    <li>导航栏内容</li>
    
    <li>导航栏内容</li>
    
    <li>导航栏内容</li>
    
    <li>导航栏内容</li>
    
    </ul>
    
    </body>
    
    </html>
  • 相关阅读:
    mac 命令大全
    GAME OF THRONES 2
    GAME OF THRONES 1
    软件工程-作业一
    猜数字游戏
    摘自-角田光代《对岸的她》
    java复习总结
    艾米莉-狄金森
    初次接触软件工程
    Environment/reflection mapping & bump mapping
  • 原文地址:https://www.cnblogs.com/wmwPro/p/5287065.html
Copyright © 2011-2022 走看看