よりどりみどり

歯列矯正・ミニマリスト体験記など

MENU
スポンサーリンク

【はてなブログ】サイドバーのプロフィール/注目・最新記事のサムネイル画像を丸くする(PC)

はてなブログのカスタマイズ記事です。
表示されている画像を丸くしてみました。 

 ※ド素人です。 コードを公開されている方のブログを見よう見まねでトライしたものですので、もっといい方法があるかもしれません。その場合は教えていただけると嬉しいです。

完成はこちら

プロフィール画像

f:id:midori32:20150830194026p:plain

注目記事

f:id:midori32:20150830194031p:plain

丸々していてかわいい。

使用したコード(PCの場合)

以下のコードをデザインCCSにコピペします。(デザイン→カスタマイズ→デザインCSS) 

.list-entry-article .thumb-image
{
width: 77px; /*サムネイル画像の横幅*/
height: 77px; /*サムネイルが画像の縦幅*/
border-radius: 4em; /*サムネイル画像の角の丸みをなくす*/
}.profile-icon
{
width: 77px; /*サムネイル画像の横幅*/
height: 77px; /*サムネイルが画像の縦幅*/
border-radius: 4em; /*サムネイル画像の角の丸みをなくす*/
}

おまけ・スマホのサムネイル画像を丸くする

スマホのサムネイル画像も同じ要領でまん丸にしました。

f:id:midori32:20150830201834j:plain

以下のコードをタイトル下にコピペします。(デザイン→スマートフォン→ヘッダ→タイトル下)

<style type="text/css"> .list-entry-article .thumb-image
{
width: 100px; /*サムネイル画像の横幅*/
height: 100px; /*サムネイルが画像の縦幅*/
border-radius: 4em; /*サムネイル画像の角の丸みをなくす*/
}
</style>

 

女性は本能的に丸いものに惹かれる性質があると聞いたことがあります。赤ん坊を見た時に本能的に愛しさを感じるためだとか。わたしも丸いものが大好き。

 

参考記事

Appismさんの記事を参考にしました。おかげさまで可愛くなりました。ありがとうございます。

はてなブログでスマホ画面のサムネイル画像を丸くするカスタマイズ - Appism