ให้เรตสมาชิก: 3 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
article, aside, nav {display:left;}
article, aside {float: left;}
article {width:600px;}
nav {width: 250px;}
</style>
</head>
<body>
<article>
<h1> สร้าง Sideder ด้วย เอเลเม็นท์ aside </h1>
<p><strong>เอเลเม็นท์ aside ใชักับกลุ่มของเนื้อหาที่เกี่ยวข้องกับเนื้อหารอบๆ แบบไม่ได้ซ้อนทับ เช่น จัดลำดับรายการของโพสต์ ,หมวดหมู่ของบล็อก,คอมเม้นล่าสุด เป็นต้น เนื้อหาประเภทนี้เกี่ยวข้องกับเนื้อหาในเพจหลัก แต่อยู่แยกออกมา
ในการพัฒนาเว็บสมัยนี้ การที่มีแถบข้างหรือที่เรียกว่า Sidebar ในเพจถือเป็นเรื่องปกติ อาจไม่จำเป็นต้องวางอยู่ด้านซ้ายเสมอไปก็ได้ แต่ส่วนใหญ่จะมีใว้ใส่ลิงค์ที่เกี่ยวข้องกันหรือราชชื่อหมู่หมวดเอาไว้ในนั้น การใช้เอเลเม้นท์ aside อย่างถูกต้องขึ้นอยู่กับว่าคุณจะวางไว้ที่ไหน ถ้าว่าใน article เนื้อหาของส่วน aside
ก็ควรจะสัมพันธ์กับเนื้อหาของ article สักนิดหน่อย เช่น อภิธานศัพท์ เป็นต้น หรือถ้า aside อยู่นอก article หรือ section ละก็ เนื้อหานั้นก็ต้องมีความสัมพันธ์กับเพจ เช่น ลิงค์ที่เกี่ยวข้อง,โฆษณาที่เกี่ยวข้อง
กับเว็บไซต์ เป็นต้น</strong>
</p></article>

<aside>
<h2> aside link </h2>
<nav>
<ul>
<li><a href="#"> หมวดหมู่ 1</a></li>
<li><a href="#">หมวดหมู่ 2</a></li>
<li><a href="#">หมวดหมู่ 3</a></li>
</ul>
</nav>
</aside>
</body>
</html>

 ที่มา : หนังสือรวมโค้ด HTML5 (แปลเเละเรียบเรียงโดย ไพบูลย์สวัสดิ์ปัญญาโชติ)

ศึกษาเพิ่มเติมได้ที่ : http://www.w3schools.com/tags/tag_aside.asp

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
B - com_MJUpgrade ไม่สามารถติดตั้งได้ใน Joomla เวอร์ชัน 3.x
โดย Parichat ส 23 มิ.ย. 2018 5:27 pm บอร์ด M061 - ปาริชาติ รัตโณภาส
0
1
ส 23 มิ.ย. 2018 5:27 pm โดย Parichat
B - ไม่สามารถ Copy สินค้าได้ [2018-05][030]
โดย Rujikon ส 23 มิ.ย. 2018 4:52 pm บอร์ด Hachanna - Testter
0
3
ส 23 มิ.ย. 2018 4:52 pm โดย Rujikon
การดูคำสั่ง sql ใน joomla
โดย Parichat ส 23 มิ.ย. 2018 3:31 pm บอร์ด Joomla Developing Knowledge
0
11
ส 23 มิ.ย. 2018 3:31 pm โดย Parichat
ปัญหา key ข้อมูลแล้ว error
โดย wilawan ส 23 มิ.ย. 2018 1:35 pm บอร์ด M062 - วิลาวัณย์ นักษัตรมณฑล
1
7
ส 23 มิ.ย. 2018 1:58 pm โดย mindphp
Alloy - Product ที่ยังไม่มีในระบบ
โดย wilawan ส 23 มิ.ย. 2018 12:18 pm บอร์ด M062 - วิลาวัณย์ นักษัตรมณฑล
0
4
ส 23 มิ.ย. 2018 12:18 pm โดย wilawan
ตรวจสอบ BPMN Zenith Workflow
โดย wilawan ส 23 มิ.ย. 2018 11:52 am บอร์ด Mindphp Task (ทดลองงาน)
0
2
ส 23 มิ.ย. 2018 11:52 am โดย wilawan
Google sheet ถ้าอยู่ที่ไฟล์ แล้วจะย้อนกลับมาหน้าแสดงรายละเอียดใน folder อย่างไร
โดย blackskulla ส 23 มิ.ย. 2018 11:10 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
1
24
ส 23 มิ.ย. 2018 11:14 am โดย thatsawan
ฺB - ไม่สามารถคืนสินค้าเข้าคลังของเสียหายได้ [2018-06][011]
โดย Rujikon ส 23 มิ.ย. 2018 11:10 am บอร์ด Hachanna - Testter
0
1
ส 23 มิ.ย. 2018 11:10 am โดย Rujikon
Q - ถ้ามีการให้ลูกค้ายืมสินค้าจะต้องดำเนินการอย่างไร [2018-06][012]
โดย Rujikon ส 23 มิ.ย. 2018 10:53 am บอร์ด Hachanna - Testter
0
4
ส 23 มิ.ย. 2018 10:53 am โดย Rujikon
B - เข้าดูข้อมูลการนัดคนเข้ามาสัมภาษณ์งานใน Application ไม่ได้
โดย watcharin ส 23 มิ.ย. 2018 10:25 am บอร์ด M.D.Soft Co.,Ltd. - Tester
1
1
ส 23 มิ.ย. 2018 10:29 am โดย watcharin
งานประจำวันที่ 23 มิถุนายน 2561
โดย Rujikon ส 23 มิ.ย. 2018 9:52 am บอร์ด M060 - นายรุจิกร พงษ์พิละ
2
16
ส 23 มิ.ย. 2018 7:23 pm โดย Rujikon
งานประจำวันที่ 23 มิถุนายน 2561
โดย wilawan ส 23 มิ.ย. 2018 9:46 am บอร์ด M062 - วิลาวัณย์ นักษัตรมณฑล
2
9
ส 23 มิ.ย. 2018 7:22 pm โดย thatsawan
งานประจำวันที่ 23 มิถุนายน 2561
โดย Parichat ส 23 มิ.ย. 2018 9:34 am บอร์ด M061 - ปาริชาติ รัตโณภาส
1
3
ส 23 มิ.ย. 2018 7:06 pm โดย Parichat
B - com_M2OpenERP Migration ติดตั้งได้แต่ไม่สามารถตั้งค่าได้ใน Joomla 3.x
โดย Parichat ศ 22 มิ.ย. 2018 5:55 pm บอร์ด M2OpenERP
0
3
ศ 22 มิ.ย. 2018 5:55 pm โดย Parichat
Q - หน้ารายละเอียดสินค้าให้แสดงราคาเป็น USD ด้วยและTHB ด้วย
โดย Parichat ศ 22 มิ.ย. 2018 2:20 pm บอร์ด Joomla Dev
5
13
ศ 22 มิ.ย. 2018 6:04 pm โดย tsukasaz
B - หน้าข้อมูลสินค้า แสดงพิ้นหลังยาวกว่าเว็บต้นฉบับ
โดย tsukasaz ศ 22 มิ.ย. 2018 1:20 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
2
12
ศ 22 มิ.ย. 2018 6:12 pm โดย tsukasaz
B - หน้าข้อมูลสินค้า ต้องแสดงราคาเป็น USD ด้วย ตามเว็บต้นฉบับ
โดย tsukasaz ศ 22 มิ.ย. 2018 1:17 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
1
9
ศ 22 มิ.ย. 2018 6:02 pm โดย tsukasaz
B - หน้าข้อมูลสินค้า เมื่อเลือกสีสินค้า รูปแบบของราคาจากตัวหนาเปลี่ยนเป็นตัวปกติ
โดย tsukasaz ศ 22 มิ.ย. 2018 1:09 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
1
5
ศ 22 มิ.ย. 2018 1:46 pm โดย Parichat
B - หน้า How to Buy ข้อความเกินขอบพื้นหลัง
โดย tsukasaz ศ 22 มิ.ย. 2018 12:07 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
1
4
ศ 22 มิ.ย. 2018 1:28 pm โดย Parichat
B - หน้าดาวน์โหลดแสดงผลไม่เหมือนของเดิม ข้อความเกินขอบพื้นหลัง
โดย tsukasaz ศ 22 มิ.ย. 2018 12:04 pm บอร์ด Doy-shop ( 15 พ.ค. - 29 พ.ค. 61)
1
4
ศ 22 มิ.ย. 2018 12:10 pm โดย Parichat