ホームページ作成(リストを作りたい)
無料!発信中!メール情報誌!

ホームページ作成しよう!
HTML〜スタイルシート

ホームページ作成TOP > リスト > リストのマークを表示しない
リストのマークを表示しない

箇条書等に使用されるリストの『マーク』を、表示しなくする方法です。

各指定方法の全体は、リストのマークを変更する(全体)に一覧がありますので参照願います。

sample
  • 項目1行目
  • 項目2行目

↓ リストの前にあるマークを無くす ↓

  • 項目1行目
  • 項目2行目
HTML 

リストマークを『表示しない』にする方法は対応がありません。この場合には、スタイルシートにて指定願います。

ホームページ作成TOP > リスト > リストのマークを表示しない > このページのTOP ▲

スタイルシート list-style:none

リストのマークをスタイルシートにて表示しないにするには、リスト全体であれば<ul>または、<ol>に、項目毎であれば<li>list-style:noneを設定する事で、マークの表示がなくなります。

スタイルシートの場合の種類は下記の様になります。

表示種類書き方
ホームページ作成(なし)表示なしlist-style:none
要素に直接書く
書き方は

<ul style="list-style:none">
<li>項目1行目</li>
<li>項目2行目</li>
</ul>
headに書く
書き方は

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">

<html>
  <head>

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">

 <style type="text/css">
 <!--

        ul   { list-style:none;}

 -->
 </style>
 </head>
 <body>

        <ul>
        <li>項目1行目</li>
        <li>項目2行目</li>
        </ul>

 </body>
</html>
こうなります
ホームページ作成(IE7)
ホームページ作成(IE)
ホームページ作成(Firefox)
ホームページ作成(OP)

ホームページ作成TOP > リスト > リストのマークを表示しない > このページのTOP ▲