ホームページ >ウェブフロントエンド >CSSチュートリアル >CSSでliの前のドットを削除する方法
CSS では、li タグに「list-style:none」スタイルを設定するだけで、list-style 属性を使用して li の前のドットをクリアできます。 list-style 属性は、li リスト項目のマーキングを制御するために使用されます。値が none の場合、li の前のプロジェクト マークをクリアできます。
このチュートリアルの動作環境: Windows7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
多くの人が Web サイトを構築するために div を使用するとき、常に li を使用しますが、表示効果の前に常に小さな黒い点が表示されます。これは多くの人を頭痛の種にしますが、ソースが見つからない場合は、次の方法を使用してクリアできます。
1. CSS でコードを記述します。 で関連する CSS を見つけます。
.li
と .ul
の下に list-sytle:none;
もちろん、次のように書く人もいます list-style-type : none
、この記述方法は、特に一部の CMS で最も一般的です。
2. 該当するページの先頭部分を見つけて、次のコードを記述します
<style type="text/css"> li{ list-style:none; } </style>
3. li と ul に list-style を追加します。
<ul style="list-style-type:none> <li> <a herf="http://123.COM">我的博客</a> </li> < /ul>
もちろん、これは非常に面倒です。
最も単純なものは最初のもので、CSS によって制御されます。これはもちろん良い効果をもたらします。
これらのメソッドはすべて、list-style:none
を設定することで設定されます。一部のメソッドは list-style-type
を使用します。そのプロパティを見てみましょう。
none: 箇条書きを使用しません
disc: 黒丸、デフォルト値 円中空円
正方形:黒四角
小数点:アラビア数字
小ローマ字 :小文字のローマ数字
#upper-roman: 大文字のローマ数字
# lower-alpha 小文字の英字
upper-alpha: 大文字の英字
これらは上記のものを置き換えるために使用でき、必要なものには対応する対応があります。
A) CSS を使用してリスト シンボルの書式を設定します:
ul li{ list-style-type:none; }
B) リスト シンボルを画像に置き換える場合は、次のようにします:
ul li{ list-style-type:none; list-style-image: url(images/icon.gif); }
C) 、左側の配置には、次のコードを使用できます:
ul{ list-style-type:none; margin:0px; }
D) リストに背景色を追加する場合は、次のコードを使用できます:
ul{ list-style-type: none; margin:0px; } ul li{ background:#CCC; }
推奨される学習: css ビデオ チュートリアル
以上がCSSでliの前のドットを削除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。