CSS2是一種用于網頁設計的樣式表語言,其中包含了許多可以用來修飾網頁元素的屬性和值。其中之一就是用來繪制圓形的屬性——border-radius。
/*繪制圓形*/ div{ border-radius: 50%; width: 100px; height: 100px; }
在上面的代碼中,border-radius屬性被設置為50%,意味著網頁元素的四個角都被削去了一半,呈現出了圓形的外觀。這個屬性也可用于控制圓角矩形的圓角半徑,不僅僅局限于繪制圓形。
如果你希望繪制出一個橢圓或其他形狀的圖像,可以分別設置border-radius的水平和垂直方向的值。例如:
/* 繪制橢圓形 */ div{ border-radius: 50% / 30%; width: 100px; height: 60px }
在上面的代碼中,border-radius屬性被設置為50% / 30%,分別代表水平半徑和垂直半徑,將會繪制出一個長寬比為5:3的橢圓形。
CSS2中的border-radius屬性提供了一種簡單的方式來繪制圓形和其他形狀的圖像,幫助設計師們更好地控制網頁元素的外觀和布局。