タブやテーブルの角を丸くする方法

タブやテーブルの他、サイドメニューのタイトル、ブログ写真などの角も丸く出来ます。
通称、角丸と言うらしいです。

自分が参考にしたサイトから画像を拝借。
border-radius: 100px 25px 50px 50px / 50px 25px 50px 25px;
を項目の下に貼り付けると画像の様に角が丸くなります。

水平方向の 左上、右上、右下、左下 / 垂直方向の 左上、右上、右下、左下の順で角のアール(丸み)を個別に指定出来ます。

全て同じアールなら
border-radius:○○px;
で充分です。

自分が追加してる項目は
・プロフィール見出し
・プロフィール本文
・プロフィール→投稿記事本文
・共通コンテンツ→コンテンツ表示
・コメント表示
・愛車コンテンツ切り替え
・関連リンク
・ギャラリータイトル
・愛車紹介プロフィールタイトル
・愛車紹介プロフィール内容
・愛車の登録日
に
border-radius:10px;
を追加

・ブログ画像
には少し大き目の
border-radius:25px;
を追加しました。

現在のスタイルにより使える場所は変わってくると思うので、プレビューで確認しながら試してみてください。

ヘッダーにも試してみましたが、borderが禁止されていて無理でした…

ついでに、この時に一緒に試したブログ画像に枠を付けるのを紹介します。
テーブル等の罫線を入れるのと同じなので知ってる方は多いかもしれませんが…
角丸と同じ、ブログ画像に
border:solid 〇px #〇〇〇〇〇〇;
を追加します。

〇pxは線の太さ、#〇〇〇〇〇〇はカラーチャート、この辺は好みで調節してください。

ちなみに、自分はブログに背景が透明のGIFアニメとか使用するので、それにまで枠付くと見栄えが悪いので外しました。