border-radius
角を丸める
角を丸めるとはなんじゃそりゃ??
という感じですが、図をみてもらうと一目瞭然です
図のように角が丸くなります
例.html
<divclass="square"><p>四角でーす</p></div><divclass="corners"><p>角丸でーす</p></div>例.css
.square{width:150px;height:100px;background-color:orange;text-align:center;}.corners{width:150px;height:100px;background-color:orange;text-align:center;border-radius:30px;上記では border-radius: 30px; で指定しましたが
数字を 50px に指定すると・・・
30px に比べてさらに角が丸くなりました
・・・ということは今度は 10px にして数字を小さくすると
さっきに比べて角張っちゃいました
つまりは・・・
数字が大きくなればなるほど角は丸くなるということがわかりました


