CSS liで異なる色を表示する方法

藏色散人
リリース: 2023-01-28 13:48:52
オリジナル
1531 人が閲覧しました

css li の異なる色表示の実装方法: 1. "ul li::marker {color: #3860f4;}" 属性を通じて li の色を変更します; 2. "li:before {content: "" を通じて;width: 6px;height: 6px;display: inline-block;border-radius: 50%;background: #4F8EFF...」属性を使用して色を設定します。

CSS liで異なる色を表示する方法

このチュートリアルの動作環境: Windows 10 システム、css3 バージョン、DELL G3 コンピューター

さまざまな色を表示する方法cssリ?

css li小さなドットの色を変更します

##方法 1
ログイン後にコピー
              
  • {item.tip1}
  •           
  • {item.tip2}
  •           
  • {item.tip3}
 ul li::marker {
          color: #3860f4;
 }
ログイン後にコピー

効果は次のとおりです:


CSS liで異なる色を表示する方法

方法 2
li:before {
           content: "";
           width: 6px;
           height: 6px;
           display: inline-block;
           border-radius: 50%;
           background: #4F8EFF;   //这里不是color
           vertical-align: middle;
           margin-right: 14px;}
ログイン後にコピー
推奨される学習: 「
css ビデオ チュートリアル

以上がCSS liで異なる色を表示する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!