รูปแบบ HTML
เค้าโครงหน้าเพื่อปรับปรุงลักษณะของเว็บไซต์ที่มีความสำคัญมาก
โปรดออกแบบรูปแบบหน้าเว็บของคุณ
ตัวอย่างออนไลน์
เค้าโครงหน้าโดยใช้ <div>
วิธีการใช้ <div> เค้าโครง
รูปแบบการใช้งานหน้า <table> องค์ประกอบ
วิธีการใช้ <table> องค์ประกอบรูปแบบ
รูปแบบเว็บไซต์
เว็บไซต์ส่วนใหญ่จะเนื้อหาลงในส่วนใหญ่ของคอลัมน์ (เช่นนิตยสารหรือหนังสือพิมพ์ที่)
เว็บไซต์ส่วนใหญ่สามารถใช้ <div> หรือ <table> องค์ประกอบในการสร้างหลายคอลัมน์ CSS จะใช้ในการวางตำแหน่งขององค์ประกอบหรือสร้างพื้นหลังที่มีสีสันและลักษณะของหน้า
แม้ว่าเราจะสามารถใช้แท็ก HTML ตารางในการออกแบบรูปแบบที่สวยงาม แต่แท็กตารางจะไม่แนะนำให้ใช้เป็นเครื่องมือในการจัดวาง - ไม่ได้เป็นเครื่องมือรูปแบบตาราง |
เค้าโครง HTML - การใช้ <div>
ส่วน div เป็นองค์ประกอบระดับบล็อกที่ใช้สำหรับการจัดกลุ่มองค์ประกอบ HTML
ตัวอย่างต่อไปนี้ใช้ห้า div องค์ประกอบในการสร้างรูปแบบหลายคอลัมน์:
ตัวอย่าง
ลอง»
รหัส HTML ข้างต้นก่อให้เกิดผลลัพธ์ต่อไปนี้:
รูปแบบ HTML - การใช้ตาราง
ใช้ภาษา HTML <table> แท็กคือการสร้างรูปแบบในลักษณะที่ง่าย
เว็บไซต์ส่วนใหญ่สามารถใช้ <div> หรือ <table> องค์ประกอบในการสร้างหลายคอลัมน์ CSS จะใช้ในการวางตำแหน่งขององค์ประกอบหรือสร้างพื้นหลังที่มีสีสันและลักษณะของหน้า
แม้ว่าคุณจะสามารถใช้ตาราง HTML เพื่อสร้างรูปแบบที่ดี แต่มีวัตถุประสงค์เพื่อนำเสนอตารางการออกแบบตารางข้อมูล - ไม่ตารางเครื่องมือรูปแบบ! |
ตัวอย่างต่อไปนี้ใช้สามแถวของตารางที่สอง - เป็นครั้งแรกและบรรทัดสุดท้ายใช้แอตทริบิวต์ colspan จะครอบคลุมที่สอง:
ตัวอย่าง
ลอง»
รหัส HTML ข้างต้นก่อให้เกิดผลลัพธ์ต่อไปนี้:
HTML Layout - เคล็ดลับที่เป็นประโยชน์
เคล็ดลับ: ประโยชน์ที่ใหญ่ที่สุดของการใช้ CSS คือว่าถ้าโค้ด CSS ถูกเก็บไว้ในแผ่นลักษณะภายนอกแล้วเว็บไซต์จะง่ายต่อการรักษาโดยการแก้ไขไฟล์เดียวคุณสามารถเปลี่ยนรูปแบบสำหรับทุกหน้า เพื่อเรียนรู้เพิ่มเติมเกี่ยวกับ CSS, เยี่ยมชม การสอน CSS
เคล็ดลับ: เนื่องจากการสร้างรูปแบบที่ทันสมัยใช้เวลานานมากโดยใช้แม่แบบที่เป็นตัวเลือกที่รวดเร็วผ่านเครื่องมือค้นหาที่คุณสามารถพบมากของแม่แบบเว็บไซต์ฟรี (คุณสามารถใช้รูปแบบเว็บไซต์เหล่านี้สร้างไว้ล่วงหน้าและเพิ่มประสิทธิภาพพวกเขา)
แท็กรูปแบบ HTML
标签 | 描述 |
---|---|
<div> | 定义文档区块,块级(block-level) |
<span> | 定义 span,用来组合文档中的行内元素。 |