引用部分の背景に画像を入れてみる
デザインにあわせて引用部分にもちょっと一工夫。
タイトルで使ったのと同じ梅の花の写真を背景にしてみました。
タグはこんな感じです。
/*引用部分*/
blockquote {
background-image:url(画像のurl);
border:1px solid #990033;
margin:10px 15px;
padding: 10px; }
画像は元の写真を不透明度70%くらいの白のマスクで覆ってます。
画像だけ見るとかなり白いかなと思ったのですが、これでも上に文字を載せると「もしかしたらちょっと邪魔かも?」と心配になりますね。
元々全体的に白っぽい写真でもこんな感じなので、色つきの写真の場合はもっと色を飛ばさないとダメかも。
背景を使わなくても、線(border:の部分)の太さ、種類、色を変えるだけで随分雰囲気が変わりますので試してみて下さい。
| 固定リンク
「ウェブログ・ココログ関連」カテゴリの記事
- 【ココログ】ファイルマネージャーへのアップロードの件(2019.06.29)
- 【覚書】Windows Live Writerの設定 (ココログリニューアル以降)(2019.04.23)
- 2019/03/19のココログ全面リニューアルに伴う不具合 覚書(2019.03.26)
- instagramに投稿した画像をサイドバーに表示してみた(2012.04.11)
- ココログ:「スパム防止認証画像」を設定しました。(2011.07.12)
「カスタマイズ」カテゴリの記事
- instagramに投稿した画像をサイドバーに表示してみた(2012.04.11)
- 久しぶりにデザイン変更(2009.10.18)
- デザイン変更(2007.04.21)
- 記事下部に表示される「同一カテゴリー内タイトル」部分をカスタマイズ(2007.04.12)
- デザイン変更:菜の花(2007.04.07)
コメント