|
| เทคนิค การจัดโคด "ข้อความวิ่งๆบนแบนเนอร์" ดูตัวอย่างและลายละเอียดโดยจขบ.จะยกรูปตัวอย่างรูปล่างนะคะ....รูปที่กำหนด มาจะเห็นว่าในส่วนของช่องที่เขียนข้อความจะอยู่สูงจากขอบซึ่งเราจะใช้เทคนนิ คเล็กๆน้อยๆในการจัดขอความให้อยู่เป็นที่เป็นทางตามที่เราต้องการค่ะ |
 |
| โคดชั้นที่1.นี่เป็นโคดที่เป็นโคดชั้นนอก กำหนดให้มี ความกว้าง คูณ ความสูง ตามขนาดของรูปตัวอย่างซึ่งก็คือ |
width="150" - ความกว้าง
|
| height: 170px - ความสูง |
| และใช้คำสั่งให้ข้อความที่เราจะเขียนอยู่แถวล่างของภาพพื้นหลังโดยใช้คำสั่ง |
| valign="bottom" - แถวล่างสุด |
| ใส่ขนาดตามสีที่กำกับไว้ที่โคดนะคะ. ก็จะได้ออกมาแบบนี้ |
| | ตัวอย่างโคดด้านซ้ายมือ
| | <table border="0" cellspacing="0" cellpadding="0" width="150" align="center" style="background-image: url('...//..ใส่รุปของพื้นหลั....'); height: 170px"> <tbody><tr><td align="center" valign="bottom" >....ใส่โคดชั้นใน....</td></tr></tbody> </table> | | |
| |
| โคดชั้นที่2. ในส่วนของโคดชั้นใน หรือ ส่วนของข้อความเลื่อนๆ ที่เราจะจัดให้ข้อความอยู่ในช่องที่ควรจะอยู่โดยสร้างกรอบที่มองด้วยตาเปล่า ไม่เห็นซึ่งก็คือ โคดล่างล่าง....กำหนดให้ กรอบอยู่ชิดซ้ายของกรอบชั้นนอก ความกว้างที่ "145" ( ในส่วนของโคดชั้นในจะไม่กำหนดความสูง ) เราจะใส่ความกว้างที่น้อยกว่ารูปพื้นหลังอยู่นิดนึงเพื่อเว้นระยะห่างของข้อ ความ และ ขอบ ของรูปพื้นหลัง ( ดูตามรูปของพื้นหลังเป็นหลักในการกำหนดความกว้าง ไม่ งง นะคะ) |
| |
| และ ในโคดชั้นในเราจะกำหนดให้มีช่องระหว่างขอบของรูปด้านซ้ายกับข้อความ และช่องจากพื้นด้านล่างจนถึง ส่วนที่เขียนข้อความตามแบบรูปแบนเนอร์ก็จะได้แบบนี้ค่ะ (ถ้า งงดูรูปตัวอย่างด้านล่างนะคะ ) ก็จะได้โคดชั้นในที่เราจัดเสร็จเรียบร้อยแล้ว ดูการใส่ขนาดตามสีที่ จขบ. กำกับไว้ |
| width="145" align="left" - ความกว้างที่ "145" ( ในส่วนของโคดชั้นในจะไม่กำหนดความสูง ) เราจะใส่ความกว้างที่น้อยกว่ารูปพื้นหลังอยู่นิดนึงเพื่อเว้นระยะห่างของข้อ ความ และ ขอบ ของรูปพื้นหลัง |
| "width: 13px" - ความกว้างจากขอบด้านซ้ายถึงจุดเริ่มเขียนข้อความ |
| "height: 26px" ความสูงระหว่างพื้นด้านล่างจนถึงส่วนของข้อความ |
| ระยะห่างทั้งหมดให้กำหนดตามแบบของแต่ละแบบนเนอร์นะคะอันที่เห็นเป็นแค่ตัวอย่างของรูปที่นำมาเสนอค่ะ |
| | ตัวอย่างโคดชั้นใน
| <table border="0" cellspacing="0" cellpadding="0" width="145" align="left"> <tbody><tr><td style= "width: 13px"></td><td align="center" valign="middle">....ใส่ข้อความเลื่อนๆๆ....</td></tr><tr><td colspan="2" style="height: 26px"></td></tr></tbody> </table>
| | |
| |
เมื่อจัดเสร็จแล้วก็นำโคดชั้นในไปซ้อนโคดชั้นที่ 1.
|
ก้จะได้โคดซ้อนกันแบบตัวอย่างด้านล่างค่ะ
|
แสดงให้เห้นส่วนที่เรากำหนดค่าไว้
| เมื่อสำเร็จแล้วจะมีผลใช้งานแบบนี้ค่ะ
| | | |
| | โคดข้อความเลื่อนๆ..ก็อปปี้โคดทั้งหมดไปวางที่โคดชั้นในค่ะ
| <marquee direction="left" scrollamount=2><font size="2" color="#6b75ff">เขียนข้อความเลื่อนๆ</font></marquee>
| | ใส่ขนาดของข้อความ | | ใส่สีให้ข้อความเลื่อนๆ | |
| หมายเหตุ ..... เวลาจัดและวางโคดทั้งหมดอย่าให้โคดแตกแถวเพราะจำทำให้มีผลของการใช้งานค่ะ | | | | เพื่อนๆลองหัดทำ จากรูปด้านล่างแล้วฝากผลงานไว้ที่กล่องคอมเม้นก็ได้นะคะ...ความรู้ทั้งนั้น..ขอบคุณค่ะ |
 | |
ฝากข้อความหลังไมค์
Rss Feed
ผู้ติดตามบล็อก : 13 คน [