;

しんみゆ.com

群馬県高崎市在住の夫婦で日記というか、つぶやきブログしてます:しんみゆ.com

css3 角丸にする

角丸にするメモ

【全部を角丸にする場合:5pxで指定】
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

【右上を10pxの角丸にして、その他は5pxで指定】
-webkit-border-radius: 5px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius: 5px;
-moz-border-radius-topright: 10px;
border-radius: 5px;
border-top-right-radius: 10px;

【全部違う数字で指定】
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 1px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 7px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 1px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 7px;
border-top-left-radius: 5px;
border-top-right-radius: 1px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 7px;

簡単に調べる方法は、こちらのサイトで
CSS Border Radius Generator

%d人のブロガーが「いいね」をつけました。

ページトップ