更新日:2016年07月12日(火)
Bloggerで気になっていたのが、画像を投稿するとなぜか自動的に表示される影と枠線。
ずっと放っておいたのだけど、やっぱり要らないなぁ。
というわけで今回は、この影と枠線を消してしまう方法をメモ!
●画像につく影と枠線の消し方
1.Blogger管理画面より「テンプレート」→「HTML の編集」でテンプレートに改変を加えます。
2.テンプレートのソースが表示されたら、以下の記述を探します。
※テンプレート内でCtrl+Fキーを同時に押し、「.post-body img」を検索ボックスに入れて検索すると探しやすいです。
3.ソースの最初と最後を「/*」と「*/」で囲みます。
.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
padding: $(image.border.small.size);
background: $(image.background.color);
border: 1px solid $(image.border.color);
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
}
.post-body img, .post-body .tr-caption-container {
padding: $(image.border.large.size);
}
.BlogList .item-thumbnail img {
padding: $(image.border.small.size);
background: $(image.background.color);
border: 1px solid $(image.border.color);
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
}
.post-body img, .post-body .tr-caption-container {
padding: $(image.border.large.size);
}
※テンプレート内でCtrl+Fキーを同時に押し、「.post-body img」を検索ボックスに入れて検索すると探しやすいです。
3.ソースの最初と最後を「/*」と「*/」で囲みます。
/*.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
}*/
・・・・・・・・・・・・・・・・・・
(省略)
・・・・・・・・・・・・・・・・・・
padding: $(image.border.large.size);}*/
4.テンプレートを「保存」。
最後に「テンプレートを保存」をクリックして完了です。
たったこれだけで、影と枠線、きれいに消えてくれました!
スッキリ~~~♪
こんなに簡単にできるなら、もっと早くやれば良かったなぁ。
同じように気になる方はぜひお試し下さい!
それでは本日はこの辺で。
最後までお付き合いいただき、ありがとうございます。
たったこれだけで、影と枠線、きれいに消えてくれました!
スッキリ~~~♪
こんなに簡単にできるなら、もっと早くやれば良かったなぁ。
同じように気になる方はぜひお試し下さい!
それでは本日はこの辺で。
最後までお付き合いいただき、ありがとうございます。
web検索
スポンサーリンク
関連記事