請(qǐng)問用css繪制圓形和半圓的原理是什么?另外為什么用%和px做單位效果會(huì)不一樣?比如div{? ? ? ? ? ? width:100px;? ? ? ? ? ? height:100px;? ? ? ? ? ? border:1px solid #ccc;? ? ? ? ? ? border-radius:50px;? ? ? ? }這樣就能畫出一個(gè)標(biāo)準(zhǔn)的圓形,可是把寬高設(shè)成10px,圓角設(shè)成5px,就不是標(biāo)準(zhǔn)的圓形了,請(qǐng)看截圖為什么會(huì)這樣,必須用%嗎?
5 回答
已采納
anet
TA貢獻(xiàn)79條經(jīng)驗(yàn) 獲得超19個(gè)贊
不不不，這個(gè)并不是標(biāo)準(zhǔn)的圓，視覺錯(cuò)誤。
標(biāo)準(zhǔn)的圓，border-radius的值同于寬高，寬高也應(yīng)一致。
你寫的是簡(jiǎn)寫屬性，該屬性的子屬性實(shí)在太多，我就講個(gè)典型
border-radius: x/y;
看到?jīng)]有，x代表水平偏移量，y代表垂直偏移量，兩者以正斜線相隔。
當(dāng)你只寫了一個(gè)值，那么水平，垂直偏移量都為該值。
來一張?jiān)鼒D
水平偏移量 %值相對(duì) 寬度參考
垂直偏移量?%值相對(duì) 高度參考
所以你要畫一個(gè)標(biāo)準(zhǔn)的圓，width=height radius:100%;
如果不用%，那么width=height=radius
-
暮女神我明白了!可是我剛才看的那本書上就是寫著寬高為100px,圓角為50px實(shí)現(xiàn)圓形,還好來問了一下.
添加回答
舉報(bào)
0/150
提交
取消