どんなんかと言えばこんなん ↓ です。 テーマ<Single A>を使ってるTumblrで見たことあるかもしれません。 仕組み的なものですが、これCSSだけで表現していて、特に円にするための専用画像とかは使ってないんですね。 (※Single Aでは各アイコンを一つのボックスの背景画像に置き、CSS3のborder-radiusで切り抜いている) このユーザーアイコンを円にする方法と、 他に角丸やグロス効果、トイカメラ風にしたり、ユーザーアイコンにいろんな加工をしてみるカスタマイズを記録。 と言っても流石にテーマごとにHTML構成が違うので、ここでは初期テーマ<Redux>のFollowingで遊んでみます。 【目次】ユーザーアイコンを円にするユーザーアイコンに角丸を加えるユーザーアイコンに枠(余白)をつけるグロス効果をつけてみるトイカメラ風に加工する 1.ユーザーアイコンを円にするTum