โดย เมื่อ 2007-08-31 08:37:31 ดูทั้งหมด 228 ครั้ง
กำหนดความกว้าง คืออย่างแรกที่ผมนึกถึง ในการคิดวางโครงสร้าง เลยย์เอ้าท์ ให้กับหน้าเว็บ ในเรื่องแรกสุดนี้ จะเริ่มจากง่ายๆ ก่อนครับกับ 1 คอลัมน์ เลย์เอ้าท์ จัดตรงกลาง
ส่วนใหญ่แล้วความกว้างของหน้าเว็บนั้นจะขึ้นอยู่กับคนเขียนแหละครับว่า คิดว่ากลุ่มเป้าหมายของเว็บที่เรากำลังทำนั้นหน้าจออยู่ที่ขนาดเท่าไหร่ หรือแล้วแต่ความชอบใจ แต่ผมจะยกตัวอย่างกรณี ที่ความกว้าง 800px
ถ้าไอเดียเริ่มแรกของเราคิดออกมาได้ประมาณว่า หน้าเว็บกว้าง 800px พื้นหลังสีเทา พื้นที่ของข้อมูลสีขาว ตัวหนังสือสีน้ำเงิน มีเส้นขอบบางๆ ทั้งซ้ายและขวาข้างละสัก 1px กำลังพอเหมาะ เว้นระยะห่างระหว่าง เส้นขอบสัก 4px กำลังดี
css code
/*1 คอลัมน์เลย์เอ้าท์*/
/*1.กำหนดภาพรวมของหน้าเว็บให้กับ body ของ html*/
body {
margin: 0 auto;
padding: 0;
background-color:#cccccc;
font-family: Tahoma, Verdana, sans-serif;
font-size: 0.8em;
color: #003399;
}
/*2. สร้าง div tag ขึ้นมาเพื่อใส่ข้อมูลที่เราต้องการ */
#one_c {
width: 794px;
position: relative;
float: none;
margin: 0 auto;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
padding: 0 4px;
background-color: #FFFFFF;
}
ตัวอย่าง
www.thaicss.com/lessons/layouts/one_c.php
Tags:
Unknown Version Unknown
