ต่อไปนี้เป็นเนื้อหาที่ยกมา: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <หัว> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>ความสูงเท่ากัน (วิธีการมีความสูงของคอลัมน์เท่ากัน)</title> <style type="text/css"> ร่างกาย{ ช่องว่างภายใน: 0; ระยะขอบ: 0; ขนาดตัวอักษร: 12px; ตระกูลฟอนต์: Arial, Helvetica, sans-serif; ความสูงของเส้น: 140%; พื้นหลัง:#E7DFD3; - #กลาง{ ความกว้าง: 580px; ลอย:ซ้าย; พื้นหลัง:#FFFFFF; การจัดแนวข้อความ: ซ้าย; - #ส่วนหัว,#ส่วนท้าย{ พื้นหลัง: #E8E8E8; ความกว้าง: 750px; การจัดตำแหน่งข้อความ: กึ่งกลาง; - #ไซด์ซ้าย{ ความกว้าง: 580px; ลอย: ซ้าย; ตำแหน่ง:ญาติ; ขอบซ้าย:-580px; - #ไซด์ไรท์{ ความกว้าง: 170px; ลอย: ขวา; ตำแหน่ง:ญาติ; ระยะขอบ: 0 -170px 0 0; พื้นหลัง: #F0F0F0; - #ส่วนท้าย{ ชัดเจน:ทั้งสอง;
- h1,h2,ที่อยู่,p{ ระยะขอบ: 0; ช่องว่างภายใน: .8em; - h1,h2{ขนาดตัวอักษร: 20px;} </สไตล์> <script type="text/javascript"> // <![ซีดีต้า[ ฟังก์ชั่นสลับเนื้อหา (ชื่อ n) { var i,t='',el = document.getElementById(ชื่อ); ถ้า (!el.origCont) el.origCont = el.innerHTML;
สำหรับ (i=0;i<n;i++) t += el.origCont; el.innerHTML = t; - - </สคริปต์> </หัว> <ร่างกาย> <div id="ส่วนหัว"> <h1>หัว</h1> <div id="กลาง"> <div id="sideright"> <div id="ด้านข้างซ้าย"> <h2>ด้านข้างซ้าย</h2> <p><a href="javascript:toggleContent('sideleft',1)">ความยาวเริ่มต้น</a> <a href="javascript:toggleContent('sideleft',2)">หน้าที่ยาวขึ้น< /a></p> <p> ไม่ใช่เรื่องง่ายที่จะเปลี่ยนจากวิธีการออกแบบแบบพิกเซลคงที่ไปเป็นแนวทางการออกแบบที่ยืดหยุ่นและสัมพันธ์กัน แต่หากใช้อย่างถูกต้อง อาจเป็นทางเลือกที่เป็นธรรมชาติในการเพิ่มการเข้าถึงและความสะดวกในการใช้งานโดยไม่ต้องเสียสละการออกแบบ </p> <p> พิกเซลเป็นจุดที่ไม่สามารถปรับขนาดได้บนหน้าจอคอมพิวเตอร์ และ h3 เป็นสี่เหลี่ยมจัตุรัสขนาดคำ เนื่องจากมีการเปลี่ยนแปลงขนาดตัวอักษร h3 หน่วยสัมพันธ์ที่แสดงขนาดข้อความที่ผู้ใช้ต้องการ </p> <p> การพิมพ์แบบตายตัวอาจง่ายกว่า เนื่องจากมีน้อยกว่าที่ต้องพิจารณาหากขนาดยังคงเท่าเดิม อย่างไรก็ตาม หากคุณใช้วิธีการออกแบบที่ยืดหยุ่น คุณสามารถใช้ <a href="http://product.yesky.com/catalog/345/" class="bluekey" target="_blank">จอภาพของคอมพิวเตอร์ได้อย่างเต็มที่ </a> และเบราว์เซอร์ </p> <p> บางทีคุณอาจต้องการให้เว็บไซต์ของคุณปรากฏในลักษณะใดลักษณะหนึ่ง แต่สิ่งที่ผู้ใช้ของคุณต้องการเห็นอาจแตกต่างกัน สิ่งใดก็ตามที่บังคับกับผู้ใช้จะบ่อนทำลายความสะดวกในการใช้งาน และส่งผลเสียต่อความสำเร็จของเว็บไซต์ </p> <p> ไม่ใช่เรื่องง่ายที่จะเปลี่ยนจากวิธีการออกแบบแบบพิกเซลคงที่ไปเป็นแนวทางการออกแบบที่ยืดหยุ่นและสัมพันธ์กัน แต่หากใช้อย่างถูกต้อง อาจเป็นทางเลือกที่เป็นธรรมชาติในการเพิ่มการเข้าถึงและความสะดวกในการใช้งานโดยไม่ต้องเสียสละการออกแบบ </p> </div>
<h2>ชิดขวา</h2> <p> ไม่ใช่เรื่องง่ายที่จะเปลี่ยนจากวิธีการออกแบบแบบพิกเซลคงที่ไปเป็นแนวทางการออกแบบที่ยืดหยุ่นและสัมพันธ์กัน แต่หากใช้อย่างถูกต้อง อาจเป็นทางเลือกที่เป็นธรรมชาติในการเพิ่มการเข้าถึงและความสะดวกในการใช้งานโดยไม่ต้องเสียสละการออกแบบ </p> <p> พิกเซลเป็นจุดที่ไม่สามารถปรับขนาดได้บนหน้าจอคอมพิวเตอร์ และ h3 เป็นสี่เหลี่ยมจัตุรัสขนาดคำ เนื่องจากมีการเปลี่ยนแปลงขนาดตัวอักษร h3 หน่วยสัมพันธ์ที่แสดงขนาดข้อความที่ผู้ใช้ต้องการ </p> <p> การพิมพ์แบบตายตัวอาจง่ายกว่า เนื่องจากมีน้อยกว่าที่ต้องพิจารณาหากขนาดยังคงเท่าเดิม อย่างไรก็ตาม หากคุณใช้แนวทางการออกแบบที่ยืดหยุ่น คุณสามารถใช้ประโยชน์จากหน้าจอและเบราว์เซอร์ของคอมพิวเตอร์ของคุณได้อย่างเต็มที่ </p> <p> บางทีคุณอาจต้องการให้เว็บไซต์ของคุณปรากฏในลักษณะใดลักษณะหนึ่ง แต่สิ่งที่ผู้ใช้ของคุณต้องการเห็นอาจแตกต่างกัน สิ่งใดก็ตามที่บังคับกับผู้ใช้จะบ่อนทำลายความสะดวกในการใช้งาน และส่งผลเสียต่อความสำเร็จของเว็บไซต์ </p> </div></div> <div id="ส่วนท้าย"> <ที่อยู่> ส่วนท้าย </ที่อยู่> <p>การผลิต: <a href="http://homepage.yesky.com">หน้าเว็บ Tao Bar</a></p> </div> </ร่างกาย> </html> <ภาษาสคริปต์ = "จาวาสคริปต์"> var ตอนนี้ = วันที่ใหม่ (); document.write("<img src='http://counter.yesky.com/counter.shtml?CID=54197&AID=-1&refer="+escape(document.referrer)+"&rand="+ now.getTime() + "&cur="+escape(document.URL)+"' border='0' alt='' width='0' height='0'>"); </สคริปต์> <โนสคริปท์> <img src="http://counter.yesky.com/counter.shtml?CID=54197&AID=-1&refer=noscriptcounter&cur=noscriptcounter" border='0' width='0' height='0'/> </noscript> |