CSS中的

和
• 標(biāo)簽都是用來(lái)創(chuàng)建列表的，其中
  標(biāo)簽表示無(wú)序列表，
  • 標(biāo)簽代表列表的每一項(xiàng)。默認(rèn)情況下，
    和
    • 是靠左顯示的，如果我們需要將其居右，則需要借助CSS的幫助。

      ul {
      text-align: right; /* 設(shè)置列表居右 */
      margin-right: 20px; /* 給列表設(shè)置右側(cè)邊距，使其與邊界產(chǎn)生間距 */
      }
      li {
      display: inline-block; /* 將列表項(xiàng)設(shè)為行內(nèi)塊級(jí)元素 */
      margin-left: 20px; /* 為列表項(xiàng)設(shè)置左側(cè)間距，使其與其它列表項(xiàng)形成一定距離 */
      }

      通過(guò)以上代碼，我們可以輕松的將列表居右，并為每個(gè)列表項(xiàng)設(shè)定左側(cè)間距，讓它們整齊排列。

      除此之外，我們還可以為列表項(xiàng)添加背景色、鼠標(biāo)懸停效果等樣式，讓列表更加美觀。

      li:hover {
      background-color: #f1f1f1; /*設(shè)置鼠標(biāo)懸停時(shí)的背景色*/
      }

      使用CSS讓列表居右，可以使頁(yè)面布局更加美觀，同時(shí)也提高了頁(yè)面內(nèi)容的層次性，讓用戶更輕松地瀏覽網(wǎng)頁(yè)。