CSS中設(shè)置圓角非常常見,但有時(shí)候我們只需要設(shè)置其中一個(gè)角的圓角。那么如何實(shí)現(xiàn)呢?
首先,我們需要知道CSS中border-radius屬性是可以設(shè)置四個(gè)角的圓角的,如下所示:
.box { border-radius: 10px 5px 4px 3px; }
這個(gè)例子中,第一個(gè)數(shù)值是左上角的圓角大小,依次為右上角、右下角和左下角。而如果我們只需要設(shè)置某一個(gè)角的圓角,可以按照如下的規(guī)則設(shè)置:
.box { border-radius: 0 0 0 10px; }
這個(gè)例子中,只有左下角的圓角被設(shè)置了10像素的大小,而其他角都被設(shè)置為0,即沒(méi)有圓角。
同樣地,如果需要設(shè)置右上角的圓角為8像素大小,其他角不需要圓角,則可以這樣寫:
.box { border-radius: 0 8px 0 0; }
以上就是設(shè)置CSS中只設(shè)置一個(gè)圓角的方法,希望對(duì)你有所幫助。