Seesaaブログのデザイン変更ワザスマートフォン専用ページを表示Seesaaブログのデザイン変更ワザcssやHTMLを編集してSeesaaブログのデザインを自由に変えてみよう!御朱印集めが楽しくなるiPhoneアプリ御朱印マップを公開しています。ダウンロードはこちらからどうぞ。Seesaaブログで、投資関係のブログを3年半ほど書いています。そのブログを続けている中で、CSSやHTMLを編集してSeesaaブログのデザイン変更にチャレンジしてきました。Seesaaブログって、かなり自由にデザインをカスタマイズできるのがいいですね!このブログでは、その様々なカスタマイズ方法をご紹介していきます。投資関係のメインブログはこちらです。【第31回】引用(blockquote)の書式を変更する今回は、引用などで使用されるblockquoteの書式を変更してみましょう。これが引用(blockquote)です。このデフォルトの引用を、引用領域内をオレンジ色、引用文は白文字にしてみます。blockquoteの背景(background)と文字色(color)プロパティを修正する。12px;background:#FF9900;color:#FFFFFF;}この修正を行うと、引用箇所がご覧のように変更されます。見やすいかどうかはさておき、これで引用(blockquote)の書式を変更できるのがお分かりになるでしょうか。今回の修正は、以上となります。blockquote要素でした。ご存知の通り、引用は<blockquote></blockquote>というHTMLタグで囲む書式となります。今回の要素名には、その前に.textが付いているのでしょうか?結論から言ってしまうと、これは子孫要素の定義書式になります。.textという要素の中で記載されるblockquoteのみを定義している書式なのです。.textは、第3回などでもお伝えした通り、ブログの記事本文の書式を定義しているクラスです。この.textに半角スペースを空けて記載されたblockquoteの書式は、ブログの記事本文にblockquoteが記載された場合はその書式を使用するという意味を持ちます。他の場所にblockquoteが記載されても、この書式は適用されません。このようにCSSでは、セレクタを半角スペースでつなぐと、後ろのセレクタは前のセレクタの子要素となっていきます。これは、#banner要素の中のh1要素の中のa(リンク)に関する書式設定となります。[必須入力]※画像の中の文字を半角で入力してください。※ブログオーナーが承認したコメントのみ表示されます。Seesaaブログ×この広告は180日以上新しい記事の投稿がないブログに表示されております。