【簡単】ワードプレスで画像の枠線を消す方法【CSSを少しだけ変更するやり方】
この記事では
ワードプレスで画像を挿入した際に表示される枠線を
消す方法を解説します。
ワードプレスのテーマによっては
画像を挿入すると枠線が表示されるものがあります。
例えばこういうものです。
この桜の画像の周りにあるグレーの枠線。
ちょっと邪魔だな・・・
いう時ってありますよね。
できればこういう風にしたいです。
この枠線はCSSを少しいじることで
簡単に消すことができますので
やり方を解説していきたいと思います。
画像の枠線の消し方
まずワードプレスのダッシュボードから
『外観』➡『テーマの編集』で
『スタイルシート (style.css)』を開いてください。
スタイルシートとは
文字のフォントや修飾などデザインを設定するためのもの。
ここで、画像の枠線も設定されています。
このスタイルシートの中で
探してほしいのが
”Image borders”
というような記述です。
Image borders
とは日本語訳すると「画像の縁」。
この付近に
画像の枠線の設定があります。
キーボードの『Ctrl+f』で”Image borders”を検索してみてください。
もし見つからない場合は
このような記述を探してください。
border: 1px solid #ccc; padding: 6px;
この2行が画像の枠線の設定そのものです。
見つかりましたでしょうか？
初期設定では
上記のようにborderにもpaddingにも値が入っていると思います。
これを次のように変更します。
border: none; padding: none;
実際には
元の設定を削除してしまうのはなく
下のようにコメントアウトするのが良いでしょう。
/*border: 1px solid #ccc; padding: 6px;*/ border: none; padding: none;
これで保存すると
画像の枠線が消えます。
いかがでしょうか。
消えていますか？
本記事がお役に立てれば幸いです。
