CSS การสร้างลิงค์ให้ list

CSS Knowledge เป็น บอร์ดรวามความรู้ CCC เน้นบทความ แนวทางการเขียนโปรแกรม บันทึกกันลืม เพื่อให้สมาชิกได้เขียนความรู้ที่ตัวเองมีให้สมาชิกท่านอื่นๆ ได้ เข้ามาอ่าน และ ไว้อ่านเองกันลืมด้วย

Moderators: mindphp, ผู้ดูแลกระดาน

GoB
PHP Super Member
PHP Super Member
Posts: 212
Joined: 12/01/2015 10:14 am

CSS การสร้างลิงค์ให้ list

Post by GoB » 20/01/2015 1:30 pm

CSS การสร้างลิงค์ให้ list

Code: Select all

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<html>
<body>
<ul>
  <li><a href="#ลิงค์ที่ต้องการให้ไป">หน้าหลัก</a></li>
  <li><a href="#ลิงค์ที่ต้องการให้ไป">ความรู้ทั่วไป</a></li>
  <li><a href="#ลิงค์ที่ต้องการให้ไป">ติดต่อสอบถาม</a></li>
  <li><a href="#ลิงค์ที่ต้องการให้ไป">สมัครสมาชิก</a></li>
</ul>
</body>
</html>
ผลลัพธ์ที่ได้
-------------------------------------------------------------------------
1.jpg
1.jpg (12.07 KiB) Viewed 304 times

CSS การสร้างลิงค์ให้ list ให้อยู่ในแถวเดียวกัน

Code: Select all

<html>
<head>
<style>
ul {
    list-style-type: none;
    margin: 0;   //ระยะห่างจากด้านบน
    padding: 0;   //ระยะห่างจากด้านซ้าย
}
li {
    display: inline;   //แสดงรายการในหนึ่งบรรทัด
}
</style>
</head>
<body>
<ul>
    <li><a href="#ลิงค์ที่ต้องการให้ไป">หน้าหลัก</a></li>
  <li><a href="#ลิงค์ที่ต้องการให้ไป">ความรู้ทั่วไป</a></li>
  <li><a href="#ลิงค์ที่ต้องการให้ไป">ติดต่อสอบถาม</a></li>
  <li><a href="#ลิงค์ที่ต้องการให้ไป">สมัครสมาชิก</a></li>
</ul>
</body>
</html>
ผลลัพธ์ที่ได้
------------------------------------------------------------------
2.jpg
2.jpg (11.82 KiB) Viewed 304 times

Return to “CSS Knowledge”

Who is online

Users browsing this forum: bankjittapol and 5 guests