資料の一覧へ

箇条書きの指定にCSSを利用する

箇条書き項目を四角で囲んだ例

CSSとタグの記述例

<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>箇条書きをCSSで指定</title>

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

ul {
list-style-type: none;
}

 　←CSSの指定開始
　←CSSが無効である場合に、指示を読み込ませないようにするための指定−開始

　←ulタグへのCSS指定開始
　←箇条書き記号を表示しない
　←ulタグへのCSS指定終了
li {
width: 100px;
margin-bottom: 2px;
padding: 2px;
border: 3px seagreen double;
background-color: palegreen;
text-align: center;
}

-->
</STYLE>

 　←liタグへのCSS指定開始
　←各項目の横幅を指定
　←項目間の距離（下）を指定
　←四角の中の余白を指定
　←枠線の太さ、色、種類を指定
　←四角の中の背景色を指定
　←四角の中の文字位置を指定
　←liタグへのCSS指定終了

　←CSSが無効である場合に、指示を読み込ませないようにするための指定−閉じ
　←CSSの指定終了
</head>

<body>

<ul>
<li>html
<li>css
</ul>

</body>