サポート » 使い方全般 » cssの反映について

  • 解決済 kcndkq

    (@kcndkq)


    同じh3のサイズの見出しでも違う装飾(違うcss)をしたいのですがどうすればいいのでしょうか。htmlタグは同じなので両方反映してしまいます。

    ヘルプの必要なページ: [リンクを見るにはログイン]

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • 最も一般的な方法は、それぞれ個別のタグに対して異なるclassの指定を追加するというものです。

    例えばブロックエディタのグーテンベルクをお使いで、投稿内の見出しであれば、標準で投稿画面の右側、設定の中に高度な設定に追加CSSクラスの入力欄があります。

    直接HTML編集が可能であれば、

    <h3 class="test1">テスト1</h3>
    <h3 class="test2">テスト2</h3>

    のようにしても良いです。

    もしくは、使いまわしが効かないためお勧めはできませんが、インラインCSSでも可能です。

    <h3 style="font-size:xx-large;">テスト1</h3>
    <h3 style="font-size:xx-small;">テスト2</h3>
    トピック投稿者 kcndkq

    (@kcndkq)

    fontawesomeを使っている方をclass指定しようと思うのですが、classの指定の方法はどうすればいいのでしょうか。
    今使っているfontawesomeのhtmlタグは
    <h3><i class=”fas fa-check-circle fa-fw my-hotpink”></i><span style=”color: #000000;”>自分の肌質に合った物を選ぶ</span></h3>
    cssには色の指定のために
    .my-hotpink {color: #ff69b4}
    とかいています。

    <span style="color: #000000;">自分の肌質に合った物を選ぶ</span>

    ここで色が指定されていますので、このままclassを追加しても(!importを使わない限りは)反映されません。

    どこをどのように装飾したいのかわかりませんが、もしh3全体の色を指定するのであれば、h3にclassを追加するのはどうでしょうか。

    <h3 class="my-hotpink"><i class=”fas fa-check-circle fa-fw”></i>自分の肌質に合った物を選ぶ</h3>
    
    .my-hotpink{
    color: #ff69b4;
    }
    トピック投稿者 kcndkq

    (@kcndkq)

    変更してみました。刺激や添加物の少ない化粧水を選ぶのような装飾を維持したいのですがどうすればいいのでしょうか。
    結果:https://cherish-time.com/2020/12/04/post1/

    すみません。先ほど提示したHTMLですが、"(半角ダブルクォーテーション)であるべきところがになっていました。

    こちらに差し替えてください。
    <h3 class="my-hotpink"><i class="fas fa-check-circle fa-fw"></i><span>自分の肌質に合った物を選ぶ</span></h3>

    • この返信は3年、 1ヶ月前にAoba Momouchiが編集しました。
    トピック投稿者 kcndkq

    (@kcndkq)

    うまく出来ました。
    ありがとうございました。

    • この返信は3年、 1ヶ月前にkcndkqが編集しました。
6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「cssの反映について」には新たに返信することはできません。