単純に見出しと項目の場合は以下の通り。
┌──────────────────────────────────────┐
│<ul>天下人                                                                  │
│  <li>織田信長</li>                                                         │
│  <li>豊臣秀吉</li>                                                         │
│  <li>徳川家康</li>                                                         │
│</ul>                                                                       │
└──────────────────────────────────────┘

入れ子にする場合は以下のような感じ。
┌──────────────────────────────────────┐
│<ul>戦国武将                                                                │
│  <li>織田信長</li>                                                         │
│  <li>豊臣秀吉</li>                                                         │
│  <li>徳川家康                                                              │
│    <ul>                                                                    │
│      <li>酒井忠次</li>                                                     │
│      <li>本多忠勝</li>                                                     │
│      <li>榊原康政</li>                                                     │
│      <li>井伊直政</li>                                                     │
│    </ul>                                                                   │
│  </li>                                                                     │
│</ul>                                                                       │
└──────────────────────────────────────┘


CSS的には以下のような感じか。
┌──────────────────────────────────────┐
│ul {                                                                        │
│    padding-left        :0;                                                 │
│}                                                                           │
│ul > li {                                                                   │
│    margin-left         :1em;                                               │
│}                                                                           │
└──────────────────────────────────────┘
  ・特にしていないとulタグの左横に適当に余白(padding)ができる
  ・liタグには「・」等の印が先頭につくが、範囲外の左側につくので
    左にmarginを開けた方がよい
    なお、前述のulタグの適当な余白と組み合わせれば見えるが
    その余白をなくしてしまうと、左詰めで「・」が見えなくなる
                                  ┌────────┐
  既定の表示イメージ              │    ulタグ      │
                                  │  ・liタグの内容│
                                  │  ・liタグの内容│
                                  └────────┘
                                  ┌────────┐
  paddingを無くした場合のイメージ │ulタグ          │
                                  │liタグの内容    │
                                  │liタグの内容    │
                                  └────────┘
                                  ┌────────┐
  上記CSSのイメージ               │ulタグ          │
                                  │・liタグの内容  │
                                  │・liタグの内容  │
                                  └────────┘
  なお、主な印は以下の通り
  ┌────────────┬──────┬──────┐
  │list-style-type:none;   │なし        │            │
  ├────────────┼──────┼──────┤
  │list-style-type:disc;   │小さい黒丸  │一階層目    │
  ├────────────┼──────┼──────┤
  │list-style-type:circle; │小さい白丸  │二階層目    │
  ├────────────┼──────┼──────┤
  │list-style-type:square; │小さい黒四角│三階層目以降│
  └────────────┴──────┴──────┘