[imanabu]

対馬様
お忙しい中、ご返信ありがとうございます。

デベロッパーツールにて

<div class=”wp-block-vk-blocks-staff vk_staff vk_staff-layout-default”><div class=”vk_staff_text”><h3 class=”vk_staff_text_name”～

クラス vk_staff などをパッと判断できるほどではないですが、
わかりやすい説明のおかげで、構造的に理解することができました。

CSS以外にももっとHTMLに関しても知識が必要だという事がわかりました。

＞もしかしたら、原因がタイプミスだったのかもしれません。

とてもお恥ずかしい話です。
自分も後で試してみます。

本当にありがとうございました。

[imanabu]

対馬様
ご返信ありがとうございます。

「できる！WordPressカスタマイズ #01 簡単なデザイン（CSS）カスタマイズ方法徹底解説」

ここも目を通したんですけど、まだ自分のものになっていません。

ここの記事　「2.1. CSSがどうしても効かない場合」を読んで、

.vk_staff_text_name{
font-family:○○○ !important;
}」

と指定もしたんですが反映されず、質問に至りました。汗

うなこ様に回答いただき、言われたとおりの設置で反映はされましたが、なぜ？となっています。
そして、自分のやりたい事、やった事が「3.4. CSSの指定の強さ」を見ても理解できていません。

Chromeの検証モードで当該ブロックをみても、

<div class=”wp-block-vk-blocks-staff vk_staff vk_staff-layout-default”><div class=”vk_staff_text”><h3 class=”vk_staff_text_name”～

となっており、なぜ、

.vk_staff
.vk_staff_text

を指定しなければならないのか？（⇒そういうものだ！）

.vk_staff_text_name{
font-family:○○○;
}
　　　　↓

.vk_staff .vk_staff_text .vk_staff_text_name{
font-family:○○○;
}

3.3. 階層のあるCSSの指定
3.4. CSSの指定の強さ

このあたりの項の理解不足、そもそも予備知識が無さすぎるとは思いますので、
もっと理解を深めるために勉強しないとダメだと感じました。

ご指導ありがとうございます。

[imanabu]

うなこ様
ご返信ありがとうございます。

指定のとおり追加CSSに記述し、反映されました。
ありがとうございます。

このように指定しても反映されなかった。

.vk_staff_text_name{
font-family:○○○;
}

.vk_staff .vk_staff_text を追加することで反映された。

.vk_staff .vk_staff_text .vk_staff_text_name{
font-family:○○○;
}

今後の勉強のためにお伺いしたいのですが、
何が違うのかご教示いただけると幸いです。

もっと構造的な理解が必要なのかもしれませんが、
これからCSSを学ぶにあたり、何から手を付けるべきか？
と、悩み中です。

お手間をお返して恐縮ですが、お時間のある時にでも返信いただければありがたいです。

以上よろしくお願い致します。

[投稿者]

投稿