THE THOR(ザ・トール)キャッチ画像の角を丸くする

THE THOR プチカスタム

キャッチ画像の角がトゲトゲしくて心を痛めていました。

繊細なからあげ棒です。

今回も簡単3分カスタマイズ!

※時間は個人差があります。



キャッチ画像の角を丸くする。

追加CSSにコードを挿入します。

外観 → カスタマイズ → 追加CSS

 

挿入するコードは以下の通り。

/*アイキャッチ角丸*/
.eyecatch {
    border-radius: 8px;
}

数字が角丸の半径になるので大きくすると大きな角丸になります。

角の縦横ごとに半径の大きさが指定できるので細かく指定すると視覚効果の高い枠を作り出すことができます。

※px指定以外にもパーセンテージで指定することもできます。

 

これが↓
ドライブヘッド安売りSALEセール

 

こうなります↓
ドライブヘッド安売りSALEセール

 

こういうのも出来ます↓
ドライブヘッド安売りSALEセール


あとがき

これで自分のサイトを見る度に心をえぐられることはなくなりましたw

この方法で角丸にすると全てのキャッチ画像が角丸になるのでご注意ください。

カスタマイズは自己責任でお願いします!

 

ピックアップ3記事のカスタマイズ

あわせて読みたい

THE THOR カスタマイズ 当サイトのキャッチ画像はカスタマイズで角を丸くしています。 ・THE THOR キャッチ画像の角を丸くする [sitecard subtitle=あわせて読みたい url=https://karaage[…]

THE THOR ピックアップ記事のカスタマイズ

THE THOR プチカスタム