CSS 导航栏

ການສະແດງ: ກອງຫຼັກສັດ

ກອງຫຼັກສັດທີ່ສັງຫຼັງ

ກອງຫຼັກສັດທີ່ຍຸດທະສາດ


ກອງຫຼັກສັດ

ກອງຫຼັກສັດທີ່ສົມຜູ້ນຳສຳລັບທຸກໆເວັບໄຊ.

ດ້ວຍການໃຊ້ CSS ທ່ານສາມາດປ່ຽນທາງພາສານິວສະຫຼະ HTML ທີ່ບໍ່ມີຄວາມຈິງຫຼາຍເປັນກອງຫຼັກສັດທີ່ທີ່ດີກວ່າ:

ກອງຫຼັກສັດ = ທາງພາສານິວສະຫຼະ

ກອງຫຼັກສັດຕ້ອງມີ HTML ທີ່ເປັນພື້ນຖານ.

ໃນຄວາມຄິດຂອງພວກເຮົາຈະໃຊ້ສັດທາງຫຼັກ HTML ເພື່ອສ້າງກອງຫຼັກສັດ.

ກອງຫຼັກສັດທາງຫຼັກແມ່ນຄູ່ວາງທາງພາສານິວສະຫຼະຂອງລາວຫຼັງຈາກທີ່ໃຊ້ <ul> ແລະ <li> ສະແນວຫຼັກຈະມີຄວາມມີຄວາມມຸມມອງ:

实例

<ul>
  <li><a href="index.asp">Home</a></li>
  
  • News
    • 
  
  • Contact
    • 
  
  • About
    •

    亲自试一试

    现在，从列表中删除项目符号以及外边距和内边距（填充）：

    实例

    ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

    亲自试一试

    例子解释：

    • list-style-type: none; - 删除项目符号。导航条不需要列表项标记。
    • 设置 margin: 0; 和 padding: 0; 删除浏览器的默认设置。

    上例中的代码是垂直和水平导航栏中使用的标准代码，您将在下一章中学习更多内容。