方法は色々とありますが、基本的には「色ごとに別のクラスを指定する」ことになると思います。
たとえば、シェブロンのリストの場合、メインカラーの箇条書きはこのまま使用します。
[list class="li-chevron"]
〜箇条書き〜
[/list]
色を変えたい場合にのみ、以下のように「style-blue」というようなクラス名を追加するようにします(もちろん別のクラス名でもOKです)。
[list class="li-chevron style-blue"]
〜箇条書き〜
[/list]
上記のような書き方をしたときに、別の配色になるようにCSSに以下のように指定します。
.entry-content .li-chevron.style-blue ul {
border-color: 色コード;
}
.entry-content .li-chevron.style-blue li:before {
color: 色コード;
}
.li-chevron.style-blue
の間に半角スペースを入れると動かないのでご注意ください(詳しくはCSSのセレクタをどうぞ)。
よろしくお願いします。
WordPressテーマSANGOの質問
円番号や指チェック、シェブロンをメインの色と、別の色とで使い分けたい
いつもお世話になっております。
円番号や指チェック、シェブロンをメインカラーと別の色で使い分けたいのですが、
以下のCSSで色を変更すると、メインカラーも変わってしまいます。
何か方法はありますでしょうか?
.entry-content .li-chevron ul {
border-color: 色コード;
}
.entry-content .li-chevron li:before {
color: 色コード;
}