Windows LiveWindows Live™
 
 
Mew's profile┢┦aΡｐy ღ M e wPhotosBlogListsMore Tools Help

Blog
    July 15

    ใส่ Background แบบที่ 2

    ใส่ภาพ background แบบที่ 2

    จะเป็นการใช้คำสั่ง Table เข้ามาช่วย ข้อดีก็คือทำให้เราสามารถ จัดตำแหน่งของภาพ และข้อความ รวมทั้ง การใส่ลูกเล่น ได้หลากหลาย

    วิธีใช้
    1.ไปที่หน้า Edit Blog Entry คลิกตรง <HTML> เพื่อเปิดการใช้งานโค้ด Html
    2. copy โค้ด ที่ให้มา ไป paste เอาไว้
    3. เปลี่ยน Url ของภาพ ให้เป็นภาพที่ต้องการ รวมถึง การจัดวาง ตามคำอธิบายด้านล่าง
    4. คลิก <HTML> อีกทีเพื่อดูผลงาน
    5. พิมข้อความ โดยคลิกไปที่ที่ว่างบน แบคกราว ละก็ พิมๆๆ
    6. พอใจแล้ว Publish Entry เลย

    Code

    <TABLE style="WIDTH: 200px; HEIGHT: 200px" borderColor=#000000 cellSpacing=0 cellPadding=3 align=center background=http://album.romerun.com/happymew/folder/16063/album/25915/image/522882/pic/original.gif border=1>
    <TBODY>
    <TR>
    <TD vAlign=center align=middle>
    <P><FONT color=#003333>Text Here</FONT></P>
    </TD></TR></TBODY></TABLE>

     

    อธิบายโค้ด ดูตามสีนะคะ

    WIDTH / HEIGHT ขนาดของภาพ เป็น พิกเซล 
                -     หรือจะใส่เป็น% ก็ได้เช่น WIDTH: 100% 
                  หมายความว่าขนาดกว้าง 100% ของขนาดบลอค ก็คือ กว้างเท่าขนาดบลอคนั่นเองค่ะ
    cellPadding=3 ระยะห่างระหว่าง ขอบ กะ ข้อความ
    Url ของภาพที่จะนำมาทำเป็น แบคกราว 
    borderColor สีขอบ เปลี่ยนได้ ดูโค้ดสีได้จากลิ้ง ทางซ้าย
    border ขอบของภาพ ใส่เลขเยอะ จะหนาขึ้น ถ้าจะไม่เอาขอบให้ใส่ค่า =0
    vAlign การจัดตำแหน่งของข้อความ ชิดขอบบน =top / จัดกลาง =center / ชิดขอบล่าง =bottom
    align การจัดตำแหน่งข้อความ ชิดซ้าย =left / กลาง =middle / ชิดขวา =right
    FONT color สีตัวอักษร ดูโค้ดสีได้จาก ลิ้งค์ทางขวาของบลอคจ้า

    ตัวอย่าง 1

    ...

    ...

    การทำ Background

    โดยใช้ Table

    ...

    ...

    ตัวอย่าง 2

    ...

    การทำ Background

    โดยใช้ Table

    แบบไม่มีขอบ border=0

    ...

     

     

    5:31 PM | Blog it | Html ZonE

    Comments (192)

    Please wait...
    Sorry, the comment you entered is too long. Please shorten it.
    You didn't enter anything. Please try again.
    Sorry, we can't add your comment right now. Please try again later.
    To add a comment, you need permission from your parent. Ask for permission
    Your parent has turned off comments.
    Sorry, we can't delete your comment right now. Please try again later.
    You've exceeded the maximum number of comments that can be left in one day. Please try again in 24 hours.
    Your account has had the ability to leave comments disabled because our systems indicate that you may be spamming other users. If you believe that your account has been disabled in error please contact Windows Live support.
    Complete the security check below to finish leaving your comment.
    The characters you type in the security check must match the characters in the picture or audio.

    To add a comment, sign in with your Windows Live ID (if you use Hotmail, Messenger, or Xbox LIVE, you have a Windows Live ID). Sign in


    Don't have a Windows Live ID? Sign up
    No namewrote:
    Welcome to enter (wow gold) and (wow power leveling) trading site, (wow gold) are cheap, (wow power leveling) credibility Very good! Quickly into the next single! Key words directly to the website click on transactions! -368919379560196
    Aug. 21
    Phongphawi​t VacancYwrote:
    หาย ไป ไหน หนอ
    Jan. 28
    Phongphawi​t VacancYwrote:
    หาย ไป ไหน หนอ
    Jan. 28
    narin phiwthongwrote:
    ขอบคุณมากๆนะค๊าบ...
    Nov. 16
    traumawrote:
    ขอบคุณสำหรับสิ่งดี ๆ ที่มีมาให้ ขอบคุณจริง ๆ จากใจ
    Oct. 25
    Rainy T.mwrote:
    ขนมน่ากินจัง...อิอิ แล้วสเปทก็สวยแล้วนะเราจะมาเยี่ยมชมบ่อยๆ
    Oct. 5
    Sasima Nubtongwrote:
    จ้า
    Sept. 28
    chontichawrote:
    ถามหน่อยนะค่ะ ทำไมwindow live spaces ของเราไม่ปรากฏในการค้นหา...ทำไมบางคนเข้าไปดู ไม่ได้ละค่ะ
    ช่วยตอบหน่อยนะค่ะ..ตอนนี้กำลังงงมากมายเลย
    Sept. 24
    •ตัวดูด•wrote:
    ตอนนี้มันเปงภาษาทายแร้วอ่าค๊า ขอบคุณน๊าค๊า ช้วยได้มากมายคะ^^ 
    Aug. 20
    •ตัวดูด•wrote:
    ตอนนี้มันเปงภาษาทายแร้วอ่าค๊า ขอบคุณน๊าค๊า ช้วยได้มากมายคะ^^ 
    Aug. 20
    ♥N ö P♥wrote:
    ได้เทคนิค และ ความรู้มากจิงจิง ขอบคุณก๊าบ^^ 
    Aug. 7
    *Ae-Aey*wrote:
    ***- ขอบคุณมากเลยค่ะได้เทคนิคดีๆไปหลายอย่างเลย คือเห็นใจคนที่ให้เทคนิกอ่ะ แบบว่าบางคนเอาของเค้าไปแล้วไม่รุจักขอบคุณหรือให้เครดิตมันดูแย่มากๆเลย เพื่อนเราก็เคยโดนอ่ะ
    Aug. 4
    mu bitwrote:
    edit blog entry มัน อยู่ตรงไหน
    ช่วยบอกทีคร้าบ ไม่รู้จิงๆ ใครก็ด้ายบอกหน่อย
    July 30
    Aishiterud​iizazaDonut​tombab...wrote:
    ขอบคุงนะคะ 
    July 28
    เถิกศรี (>"<)wrote:
    ขอบคุณค่ะ  ที่เอาสิ่งดีดีมาให้ทุกๆคนที่ทำเสปชเหมือนกันดู
    แต่คนที่มาดูแล้ว  ก็เคารพสิทธ คนที่เป็นเจ้าของฟามคิดหน่อยนะ
    เพื่อน ก้อโดนอ่าค่ะ แล้วมันทำให้คนที่คิดอะไร ดีดีเกี่ยวกับสเปช
    ที่มีน้ำใจนำความรู้ที่เค้ามี มาบอกคนมะรู้อย่างพวกเรา เสียความรู้สึกอ่านะ
    -++++++ ขอบคุณ ค่ะ ที่ทำให้เรามีเสปชสวยๆกะเค้า สาธุ +++++++
    July 22
    Jarat Radenwrote:
    ขอบใจ
     
    June 30
    _U n I f L o R o U s_ G i gwrote:
    ขอบคุณมากค่ะ....ทำได้แล้วอ่ะค่ะ อิอิ
    June 27
    ..jEAb ..wrote:
    เก่งจัง
     
    ศึกษาๆๆน๊าค๊า
    June 16
    chaturapit pisuttanuw​atwrote:
    ขอบคุณคับ
    May 23
    Xiahsoul Jung Familywrote:
    อ่าขอบคุณค่ะที่สอนวิธีทำน๊า อิอิอิ
    May 21
    Next >    Last >>

    Trackbacks

    Weblogs that reference this entry
    • None