引用符の色の変更について

  • このトピックには2件の返信、1人の参加者があり、最後ににくきゅうにより9年、 7ヶ月前に更新されました。
2件の返信スレッドを表示中
  • 投稿者
    投稿
    • #50035
      にくきゅう
      ゲスト

      初めまして。Simplicityを使用させていただいているものです。とても使いやすく大変重宝しております。

      しかし、引用符の色の変更の仕方が検索しても分からなかったため、質問させていただきます。

      引用符の色はどうやって変更するのか、
      またその変更は、記事内でそれぞれの引用符でできるのか、記事ごとの変更になるのか、サイトごとの変更になるのかを併せてお答えいただければ幸いです。

      よろしくお願いします。

    • #50036
      Hidekichi
      ゲスト
      blockquote::before,
      blockquote::after {
        color: 任意の色;
      }

      これで全体的に変わります。

      > 記事内でそれぞれの引用符でできるのか、
      > 記事ごとの変更になるのか、サイトごとの変更になるのか

      このいずれもできます。

      <blockquote class="red">

      あるいは、

      <blockquote class="bq_red">

      などとしてもよいですが、前者なら

      blockquote.red::before,
      blockquote.red::after {
        color: red;
      }

      でよいですし、後者なら、

      .bq_red::before,
      .bq_red::after {
        color: red;
      }

      ともできます。.bq_blueというのを作っておき、使い分けもできますし、blockquote.blueでもよいです。ただし、cssは優位性があり、タグ+クラスは優位性が強いため汎用的ではありません。つまり内容を上書きするのにいちいちタグをつけないといけなくなります。

      また組み合わせという手法もあり、beforeは赤、afterを青とすることもできます。

      サンプル: blockquoteのquote色つけ | jsfiddle

      範囲を限定的に記事だけとする場合は、

      #the-content blockquote::before,
      #the-content blockquote::after {
        color: red;
      }

      などのようにします。つまりどうとでもできます。
      またデフォルトのスタイル自体も変更できます。

      サンプル: blockquoteデザイン | codepen

    • #50040
      にくきゅう
      ゲスト

      Hidekichiさん、ありがとうございました!

      無事変更することができました!!
      分かりやすく説明してくださり、本当に感謝ですm(_ _)m

      他の解答でも大変お世話になっています(*^^*)
      またお願いします!

2件の返信スレッドを表示中
  • トピック「引用符の色の変更について」には新しい返信をつけることはできません。
スポンサーリンク
アドセンス(大)
アドセンス(大)