四川时时彩开奖走势图
·您當前的位置:首頁 > 技術教程 > Html5技術 >

[CSS3]border-radius圓角用法

時間:2019-01-25 16:08w3school
必須出現一個值,可長度可百分比,比如:border-top-left-radius:5px,border-top-left-radius:5px 50%都是可行

w3c屬性值詳解:
[ <length> | <percentage> ]:必須出現一個值,可長度可百分比,比如:border-top-left-radius:5px,border-top-left-radius:5px 50%都是可行
{1,2}: 表示他們的值最小可以重復一次,最大可重復兩次。假如只有一個值,表示圓角,那么它的水平距離和垂直距離相等,即第二個值復制第一個值;假如是兩個值,那么確定一個橢圓角,第一個值橢圓的水平半徑,第二值為橢圓的垂直半徑,說起來有點拗口,直接上圖:

只有1個值,如:border-top-left-radius:50px,表示半徑為50px圓,如圖:
左上角
標注錯誤了,盒子尺寸為:300*100

假如有兩個值,如:border-top-left-radius:50px 100px,表示水平半徑為50px,垂直半徑為100px的橢圓,如圖:
左上角

同理 border-top-right-radius(右上圓角半徑), border-bottom-right-radius (右下圓角半徑),border-bottom-left-radius(左下圓角半徑),也是如此。你只要記住當某個角為一個值時,確定是一個圓,當使用兩個值確定一個橢圓。

熱門文章推薦

請稍候...

保利威視云平臺-輕松實現點播直播視頻應用

酷播云數據統計分析跨平臺播放器

四川时时彩开奖走势图 龙王捕鱼送30 比分直播 赛车计划软件哪个好 广东快乐10免费计划 开设网站赚钱 pk10直播开奖赛车App 吉林快3投注图 炸金花软件作弊下载 华为王者传奇手游官网 时时彩后二