精品人人槡人妻人人槡,无码午夜国产视频,日韩精品无码有码视频,国产成人精品日本亚洲成熟

<var id="lf53i"><track id="lf53i"><ins id="lf53i"></ins></track></var>

  • <rp id="lf53i"></rp>
    <var id="lf53i"><track id="lf53i"><ins id="lf53i"></ins></track></var>

    <video id="lf53i"></video>
    <b id="lf53i"><acronym id="lf53i"></acronym></b>

      1. 0712-2888027 189-8648-0214
        微信公眾號(hào)

        孝感風(fēng)信網(wǎng)絡(luò)科技有限公司微信公眾號(hào)

        當(dāng)前位置:主頁(yè) > 技術(shù)支持 > HTML5/CSS3 > CSS3 圓角屬性(border-radius)

        CSS3 圓角屬性(border-radius)

        時(shí)間:2015-11-05來(lái)源:風(fēng)信官網(wǎng) 點(diǎn)擊: 760次

        前綴

        • -moz(例如 -moz-border-radius)用于Firefox
        • -webkit(例如:-webkit-border-radius)用于Safari和Chrome。

         

        例1

        <div id="round"></div>
        #round {
            padding:10px; width:300px; height:50px;
            border: 5px solid #dedede;
            -moz-border-radius: 15px;      /* Gecko browsers */
            -webkit-border-radius: 15px;   /* Webkit browsers */
            border-radius:15px;            /* W3C syntax */
        }

        效果:
        CSS圓角

         

        例2:無(wú)邊框

        <div id="round"></div>  
        #round {
            padding:10px; width:300px; height:50px;
            background:#FC9; 
            -moz-border-radius: 15px;
            -webkit-border-radius: 15px;
            border-radius:15px;
        }

        效果:
        CSS圓角

         

        書寫順序

        /* Gecko browsers */
        -moz-border-radius: 5px; 
        /* Webkit browsers */
        -webkit-border-radius: 5px; 
        /* W3C syntax - likely to be standard so use for future proofing */
        border-radius:10px;

         

        其它

        支持上、右、下、左

        border-radius:5px 15px 20px 25px;

        支持拆分書寫

        /* Gecko browsers */
        -moz-border-radius-topleft: 20px;
        -moz-border-radius-topright: 0;
        -moz-border-radius-bottomleft: 0;
        -moz-border-radius-bottomright: 20px;
         
        /* Webkit browsers */
        -webkit-border-top-left-radius: 20px;
        -webkit-border-top-right-radius: 0;
        -webkit-border-bottom-left-radius: 0;
        -webkit-border-bottom-right-radius: 20px;
         
        /* W3C syntax */
        border-top-left-radius: 20px;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-bottom-left-radius:  20px;

         

        支持性

        瀏覽器 支持性
        Firefox(2、3+)
        Google Chrome(1.0.154+…)
        Google Chrome(2.0.156+…)
        Safari(3.2.1+ windows)
        Internet Explorer(IE7, IE8) ×
        Opera 9.6 ×
        熱門關(guān)鍵詞: CSS3 圓角屬性 border-radius
        欄目列表
        推薦內(nèi)容
        熱點(diǎn)內(nèi)容
        展開