Hello!!!.. New Friends Come .Some Friends Leave. Hope You keep me into your heart.As i keepyou in mine. I willnever forget you. Promise .
Group Blog
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat

lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
lozocat
Group Blog
 
<<
สิงหาคม 2553
1234567
891011121314
15161718192021
22232425262728
293031 
 
29 สิงหาคม 2553
 
All Blogs
 
•°¤* เทคนิค การจัดโคด "ข้อความวิ่งๆบนแบนเนอร์" *¤°•


เทคนิค การจัดโคด "ข้อความวิ่งๆบนแบนเนอร์" ดูตัวอย่างและลายละเอียดโดยจขบ.จะยกรูปตัวอย่างรูปล่างนะคะ....รูปที่กำหนด มาจะเห็นว่าในส่วนของช่องที่เขียนข้อความจะอยู่สูงจากขอบซึ่งเราจะใช้เทคนนิ คเล็กๆน้อยๆในการจัดขอความให้อยู่เป็นที่เป็นทางตามที่เราต้องการค่ะ
lozocat
โคดชั้นที่1.นี่เป็นโคดที่เป็นโคดชั้นนอก กำหนดให้มี ความกว้าง คูณ ความสูง ตามขนาดของรูปตัวอย่างซึ่งก็คือ
width="150"  - ความกว้าง
height: 170px - ความสูง
และใช้คำสั่งให้ข้อความที่เราจะเขียนอยู่แถวล่างของภาพพื้นหลังโดยใช้คำสั่ง
valign="bottom" - แถวล่างสุด
ใส่ขนาดตามสีที่กำกับไว้ที่โคดนะคะ. ก็จะได้ออกมาแบบนี้
 ตัวอย่างโคดด้านซ้ายมือ
<table border="0" cellspacing="0" cellpadding="0" width="150" align="center" style="background-image: url('...http://..ใส่รุปของพื้นหลั....'); 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>
ใส่ขนาดของข้อความ
ใส่สีให้ข้อความเลื่อนๆ
หมายเหตุ ..... เวลาจัดและวางโคดทั้งหมดอย่าให้โคดแตกแถวเพราะจำทำให้มีผลของการใช้งานค่ะ
 
เพื่อนๆลองหัดทำ จากรูปด้านล่างแล้วฝากผลงานไว้ที่กล่องคอมเม้นก็ได้นะคะ...ความรู้ทั้งนั้น..ขอบคุณค่ะ

lozocat


lozocatlozocat

คลิก ดูโคดแบบนเนอร์สำเร้จรูปได้ที่นี่ค่ะ

lozocatlozocat
T O P
lozocatlozocat



Create Date : 29 สิงหาคม 2553
Last Update : 30 สิงหาคม 2553 2:16:05 น. 10 comments
Counter : 2032 Pageviews.

 

เย้ยยย....ดีใจจังทำได้แล้ว....


โดย: lozocat วันที่: 29 สิงหาคม 2553 เวลา:20:23:38 น.  

 




โดย: หน่อยอิง วันที่: 29 สิงหาคม 2553 เวลา:21:05:36 น.  

 
ขอบคุณมากค่ะ


โดย: kobnon วันที่: 30 สิงหาคม 2553 เวลา:9:16:11 น.  

 
น่ารักจังค่ะ


โดย: POOHRITA วันที่: 31 สิงหาคม 2553 เวลา:10:51:18 น.  

 
lozocat
1111111111
lozocat


โดย: lozocat วันที่: 6 กันยายน 2553 เวลา:6:15:42 น.  

 
ขอบคุณค่า


โดย: หมูแอนร่าเริง วันที่: 21 กันยายน 2553 เวลา:12:47:43 น.  

 
ลองดูนะค่ะ



โดย: นุช (nuchkitty ) วันที่: 1 พฤษภาคม 2554 เวลา:3:55:46 น.  

 
ขอบคุณ คุณ Cat มาก ขอนำไปฝากเพื่อนนะค๊ะ


ขออนุญาติแนะนำบล๊อกนี้ของคุณ Cat ให้เพื่อนยายเก๋าด้วยนะค๊ะ


โดย: ยายเก๋า (ชมพร ) วันที่: 6 มิถุนายน 2555 เวลา:15:40:14 น.  

 
ขอบคุณมากค่ะ ความรู้ดีมากเลย..(ทดลองๆ)




โดย: bigwat วันที่: 22 มิถุนายน 2555 เวลา:10:19:18 น.  

 
I believe in angels,something good in everything I see


โดย: rosemelodyworld วันที่: 21 เมษายน 2556 เวลา:23:42:54 น.  

ชื่อ : * blog นี้ comment ได้เฉพาะสมาชิก
Comment :
  *ส่วน comment ไม่สามารถใช้ javascript และ style sheet
 

lozocat
Location :


[ดู Profile ทั้งหมด]

ให้ทิปเจ้าของ Blog [?]
ฝากข้อความหลังไมค์
Rss Feed
Smember
ผู้ติดตามบล็อก : 13 คน [?]




Friends' blogs
[Add lozocat's blog to your web]
Links
 

 Pantip.com | PantipMarket.com | Pantown.com | © 2004 BlogGang.com allrights reserved.