HTMLのulタグとliタグのドットを削除する方法

HTML の ul タグと li タグからドットを削除するには、次の手順を実行します。 CSS スタイル list-type none: ul, li { list-style-type: none } を使用します。疑似要素とコンテンツ属性の前に使用します: li { 位置: 相対; 左: 1em; }; 位置: 左: 0; height : 0.

HTML の ul タグと li タグのドットを削除する方法

HTML では、ul (順序なしリスト) タグと li (リスト項目) タグは通常、マーカーとして小さな丸い点を表示します。これらのドットを削除する必要がある場合は、CSS スタイルシートを使用できます。

#メソッド:

1. #リスト スタイル タイプなしを使用:

   #

   <code class="css">ul, li {
     list-style-type: none;
   }</code>

疑似要素と content 属性の前に使用:

2. <code class="css">li {
     position: relative;
     padding-left: 1em;
   }
   
   li:before {
     content: "";
     position: absolute;
     left: 0;
     top: 0.2em;
     width: 0.5em;
     height: 0.5em;
     background-color: #000;
     border-radius: 50%;
   }</code>

使用例:

<code class="html"><ul>
  <li>项目 1</li>
  <li>项目 2</li>
  <li>项目 3</li>
</ul></code>

<code class="css">ul, li {
  list-style-type: none;  // 使用列表样式类型 none
}</code>

効果:

丸いドットが削除され、プレーン テキストの内容を含む順序なしリストが作成されます。

注:

上記の解決策は、Firefox、Chrome、Safari などの最新のブラウザでのみ機能します。

Internet Explorer などの古いブラウザの場合、同じ効果を得るには追加のハックまたは JavaScript が必要になる場合があります。

以上がHTMLのulタグとliタグのドットを削除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。