CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

CSSを使用して順序付けされていないリストに四角い弾丸を作成する方法

CSSプロパティlist-style-typeを使用して、順序付けされていないリストに四角い箇条書きを作成する方法を学びます 。

デフォルトでは、順序付けされていないリストアイテム（<ul> ）ウェブページでは丸い箇条書きを使用しています。

丸い箇条書きは次のようにスタイル設定されます：

ul {
  list-style-type: disc;
}

そして、次のようになります：

  • HTML
  • CSS
  • JavaScript

箇条書きを正方形にするには、デフォルトのlist-style-typeをオーバーライドできます。 このような設定：

ul {
  list-style-type: square;
}

四角い弾丸の例：

  • HTML
  • CSS
  • JavaScript

四角い箇条書きは珍しいですが、一部のWebサイトでは最適です。目的のスタイルやテーマによって異なります。


  1. CSSを使用してリスト内の弾丸をアニメーション化する方法

    順序付けられていないリストで箇条書きのスタイルを設定するには、リストスタイルのporを使用できます 構文 CSSli-styleプロパティの構文は次のとおりです- li {    list-style: /*value*/ } 例 次の例は、CSSのliスタイルのプロパティを示しています。 <!DOCTYPE html> <html>    <head>       <style>          li {  

  2. HTMLで四角い箇条書きの順序付けられていないリストを作成するにはどうすればよいですか？

    HTMLで順序なしリストを作成するには、タグを使用します。順序付けされていないリストは、タグで始まります。リストアイテムはタグで始まり、ディスク、正方形、円などとしてマークされます。デフォルトは箇条書きで、小さな黒い円です。 丸で囲まれた順序なしリストを作成するには、CSSプロパティlist-style-typeを使用します。 style属性を使用します。 style属性は、要素のインラインスタイルを指定します。この属性は、HTMLのタグとともに使用され、CSSプロパティのlist-style-typeを使用して、順序付けされていないリストに四角い箇条書きを追加します。 スタイル属性の使用は