エントリー本文
枠線（border）の指定
ご質問を頂きましたので、テンプレートで提供しているサイドメニュータイトルや本文のblockquoteタグで用いている枠線のスタイルシート指定方法を紹介します。
まず指定フォーマットは下記の通りです。
- border: width style color
- border-top: width style color
- border-right: width style color
- border-bottom: width style color
- border-left: width style color
「border:?」は全ての枠線を一括指定、「border-xxx:?」は上下左右の枠線を個別指定します。一括指定か個別指定のいずれかを使用します。斜体の部分に枠線の詳細を指定します。それぞれの意味は
- width：枠線の幅
- style：枠線のスタイル
- color：枠線の色
となっています。
次にスタイルシートを外部ファイル（styles-site.css）に記述する場合のサンプルをいくつか記します｡ここではblockquoteタグを直接指定する方法で記しておきます。
【シンプルな指定（幅：1px／スタイル：1本線／色：青）】
- blockquote { border: 1px solid blue; }
hogehoge hogehoge
【このサイトのblockquote指定（幅：2px／スタイル：点線／色：グレー）】
- blockquote { border: 2px dotted 999999; }
hogehoge hogehoge
【付箋紙風（幅：左10px、その他1px／スタイル：1本線／色：緑）】
- blockquote { border-left: 10px solid green; border-top: 1px solid green; border-bottom: 1px solid green; border-right: 1px solid green; }
hogehoge hogehoge
幅・色はなんとなくお分かりになると思いますので、スタイル指定のみ下記に列挙しておきます。それぞれどのように表示されるかはお試しになってください。
none 非表示（デフォルト） hidden 非表示 solid 1本線 double 2本線 groove 窪んだ線 rigde 隆起した線 inset 全体が窪んだように表示 outset 全体が隆起したように表示 dashed 破線 dotted 点線
なお指定内容によってはブラウザによって表示が異なる場合がありますのでご注意ください。
≫ わたくし用カスタムメモ from et [えっと] きまぐれぶろぐ
■未
BlogPeople リンクにスクロールバーをつける by PIROBLO... [続きを読む]
≫ 引用タグの設定 from (´д`)ブログ
ニュースのカテゴリでよく使う引用タグ blockquote の設定が スタイルシ... [続きを読む]
≫ MTのblockquote編集 from 電脳社会
MovableTypeをちょこっとカスタマイズしてみました。他のブログサイトを見... [続きを読む]
前から変えてみたいと思ってたんですけど、面倒で放置しておりました。が、丁寧にまとめられてるのを見て私も変更してみました。ありがとうございました。
丁寧なご回答ありがとうございました。
はじめまして。
ライブドアの普通のテンプレを使用してるのですが、以前から「blockquote」の変更をしたくて、方法を探していたところ、こちらにたどりつきました。付箋紙風、の記述の仕方を参考にさせてもらいました。ありがとうございました。
(リンクフリーとのことなので、これからも読ませてもらいたいので、 BlogPeople のリストにくわえさせてもらいました。どこで報告していいかわからなくて、こちらでご報告しておきます。)
