CSS - リスト(ul - li)のマーク(点)を消す

ulタグの点を消すには、ul要素 に対してスタイル「list-style: none」を指定します。

マークあり - Google Chrome
マークあり - Google Chrome
マークなし - Google Chrome
マークなし - Google Chrome

サンプルコード1 - ul タグに直接指定

ul タグに 「style="list-style: none"」を指定します。 
<!doctype html>
<html lang="ja">
<head>
    <meta charset="UTF-8" />
    <title>ul-サンプル</title>
</head>
<body>
    <ul style="list-style: none">
        <li>Hello</li>
        <li>World</li>
    </ul>
</body>
</html>

サンプルコード2 - スタイルを定義し、ul タグに class で指定

  1. head 内で「list-style: none;」を指定したスタイルを定義します。
  2. 定義したスタイルを ul タグの class で指定します。 
<!doctype html>
<html lang="ja">
<head>
    <meta charset="UTF-8" />
    <title>ul-サンプル</title>
    <style>
        .no-mark {
            list-style: none;
        }
    </style>
</head>
<body>
    <ul class="no-mark">
        <li>Hello</li>
        <li>World</li>
    </ul>
</body>
</html>

サンプルコード3 - 外部CSSファイルでスタイルを定義し、ul タグに class で指定

  1. CSSファイルに「list-style: none;」を指定したスタイルを定義します。
  2. CSSファイルを読み込みます。
  3. 定義したスタイルを ul タグの class で指定します。
style.css 
.no-mark {
  list-style: none;
}

index.html

<!doctype html>
<html lang="ja">
<head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="style.css">
    <title>ul-サンプル</title>
</head>
<body>
    <ul class="no-mark">
        <li>Hello</li>
        <li>World</li>
    </ul>
</body>
</html>

検証環境