บทที่แล้วเรารู้จักกับ index.template.php ไปแล้ว ถ้าจะเปรียบเทียบแล้ว index.template.php เปรียบเหมือนหน้าตาของหญิงสาวที่ไร้เครื่องประดับ เธอดูเปล่าเปลือย ธรรมดาไม่น่าดู แต่หากว่าได้แต่งองค์ทรงเครื่อง ทาหน้าทาปาก เขียนคิ้ว ใส่เสื้อผ้าหลากสี ด้วย style.css เมื่อไร เมื่อนั้นจากหญิงสาวธรรมดา จะกลายเป็นหญิงงามที่ไม่ธรรมดาทันที !!
อย่ากระนั้นเลย เราจับเธอมาแต่งตัวกันดีกว่าครับ ปล่อยเปลือยเปล่าเช่นนั้นนานๆจะไม่ดีเอา
นี่คือหน้าตาเดิมแบบธรรมดาๆ
ผมได้ใส่เสื้อผ้าและแต่งปากให้เธอบ้างเล็กน้อย .. (แค่เล็กน้อยเท่านั้นนะครับ ยังไม่เสร็จ)
มาดูสิ่งที่ผมทำกับเธอก่อนว่า ผมทำอะไรลงไปบ้าง
ผมเพิ่ม <div class="main"> ไปในไฟล์ index.template.php ในส่วนของฟังก์ชั่น template_main_above และเพิ่ม </div> เพื่อปิดแท็ก<div class="main"> ในส่วนของฟังก์ชั่น template_main_below
ธีมเดิมไม่มีdiv ใหญ่คร่อมเลย มีเพียง table ซึ่งยากต่อการจัดการ ดังนั้นผมเลยคร่อมด้วย <div class="main"> ซะ
หลังจากได้ <div class="main"> ไว้ในไฟล์ index.template.php แล้ว เราก็มาเขียนหน้าทาปากให้เริ่ดที่ไฟล์ style.css
ผมเพิ่มคำสั่งนี้ครับ
body
{
background: #B4E0FF url(images/header.png) no-repeat ;
margin: 0px;
padding: 12px 30px 4px 30px;
}
.main {
width:980px;
margin:0 auto;
padding:5px 10px 5px 25px;
}
คือ เพิ่มภาพพื้นหลัง และจัดการส่วนเนื้อหาให้มีความกว้างแค่ 980px ก็พอ เซตให้มันอยู่ตรงกลางด้วยคำสั่ง margin: 0 auto:
เพียงเท่านี้เราก็เห็นความเปลี่ยนแปลงของธีมใหม่ของเราบ้างแล้วละครับ
มันยังไม่จบเพียงเท่านี้ เดี่ยวคราวหน้ามาทาสีฉวีวรรณให้เธอเอี่ยมกว่านี้ จะได้เป็นหญิงสาวพราวเสน่ห์และมีหน้าตาไม่เหมือนใครอีกด้วย..
ไม่มีความคิดเห็น:
แสดงความคิดเห็น