การเขียนบล็อก VII - เปลี่ยนรูปแบบธีมให้ดูเก๋ๆ หากเพื่อนๆ ต้องการสร้างความแปลกใหม่ให้กับบล็อก ซึ่งเดิมเป็นแบบเรียบๆ วันนี้เรามาสร้างความเก๋ไก๋ให้กับบล็อกของเราด้วยธีมอีกแบบหนึ่งดีกว่าค่ะ เพื่อนๆ เห็นธีมที่แมวใช้อยู่ในตอนนี้หรือเปล่าค่ะ วันนี้เรามาทำธีมแบบนี้กันค่ะ บางท่านอาจจะไม่เห็นความแตกต่างของธีม แบบนี้กับธีมเดิมๆ ที่ใช้กันอยู่ มันแตกต่างกันอย่างไรมาดูกันค่ะ ทั้ง 2 ภาพที่เห็น เป็นโค้ดธีมเดียวกันค่ะ แต่แสดงผลแตกต่างกันขึ้นอยู่กับ เบราเซอร์ที่เราใช้ รูปแรกที่เห็นเป็นการแสดงผลจาก Mozilla Firefox รูปที่ 2 เป็นการแสดงผลจาก Internet Explorer ธีมชุดนี้จะเป็นการกำหนดให้กรอบด้านใน ใสจนมองเห็นพื้นหลังของเราค่ะ สีของกรอบชั้นในจะเปลี่ยนตามสีของพื้นหลังของเราค่ะ ข้อกำหนดของการเปลี่ยนรูปแบบธีม 1. เลือกรูปแบบธีมเป็นธีมอิสระ (แนะนำให้เลือก ธีมอิสระเมนูขวาค่ะ) 2. โค้ดธีมให้วางที่ช่อง Slogan ค่ะ พร้อมแล้วเรามาเริ่มกันเลยค่ะ :::โค้ด::: <table width=700 style="border: ขนาดของเส้นกรอบบล็อกpx ลักษณะของเส้น #สีของเส้น align=center cellpadding=0 cellspacing=0> <tr> <td> <table width="700" border="0" align="center" cellpadding="0" cellspacing="0" style="filter:progid:DXImageTransform.Microsoft.Gradient(gradientType='0',startColorstr='#99E0FFFF',endColorstr='#99E0FFFF')"> <tr> <td width="700" height="0" background=""></td> <tr style="background-image:URL();background-repeat:no-repeat;background-position:right top;"> <td> <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td> <table width="700" border="0" align="center" cellpadding="0" cellspacing="0" style="filter:progid:DXImageTransform.Microsoft.Gradient(gradientType='0',startColorstr='#99E0FFFF',endColorstr='#99E0FFFF')"></td></tr></table> โค้ดส่วนที่เราต้องปรับเปลี่ยน ตามที่เน้นสีเลยค่ะ สีแดง คือ ขนาดของเส้นกรอบบล็อกpx กำหนดให้เป็น 1, 2, 3,....... หรือหากไม่ต้องการให้มีกรอบ ก็กำหนดให้เป็น 0px ค่ะ สีน้ำเงิน คือ ลักษณะของเส้น ซึ่งมีดังนี้ solid, double, dashed, dotted, groove, ridge, inset และ outset อยากรู้ว่าลักษณะของเส้นกรอบแต่ละเส้นเป็นอย่างไร ก็ไปดูที่นี่ค่ะ คลิก!! สีม่วง คือ สีของเส้นกรอบ ใส่โค้ดสีที่เป็นตัวเลขต่อท้าย # ค่ะ คงไม่ยากกันเกินไปใช่ไหมค่ะ ดูการใส่ภาพพื้นหลัง :::คลิก::: นำโค้ดสำหรับใส่ภาพพื้นหลังในมุมต่างๆ มาฝากด้วยค่ะ เพื่อนจะได้แต่งบล็อกสวยๆ แล้วนำมาให้ชมกัน โค้ดใส่รูปให้รูปอยู่เรียงแนวยาวด้านบน <style>body {background-image:url("……ใส่ URLของภาพ……") ;background-repeat : repeat-x ;background-attachment : fixed; background-color: "……ใส่สีพื้นหลัง……";}</style> โค้ดใส่รูปให้รูปอยู่มุมขวาล่าง <style>Body {background-image:url("……ใส่ URLของภาพ……");background-position: right bottom;background-repeat: no-repeat;background-attachment: fixed;background-color: "……ใส่สีพื้นหลัง……";}</style> โค้ดใส่รูปให้รูปอยู่มุมขวากลาง <style>Body {background-image:url("……ใส่ URLของภาพ……");background-position: right center;background-repeat: no-repeat;background-attachment: fixed;background-color: "……ใส่สีพื้นหลัง……";}</style> โค้ดใส่รูปให้รูปอยู่มุมขวาบน <style>Body {background-image:url("……ใส่ URLของภาพ……");background-position: right top;background-repeat: no-repeat;background-attachment: fixed;background-color: "……ใส่สีพื้นหลัง……";}</style> โค้ดใส่รูปให้รูปอยู่มุมซ้ายล่าง <style>Body {background-image:url("……ใส่ URLของภาพ……");background-position: left bottom;background-repeat: no-repeat;background-attachment: fixed;background-color: "……ใส่สีพื้นหลัง……";}</style> โค้ดใส่รูปให้รูปอยู่กลางบล็อกด้านซ้าย <style>Body {background-image:url("……ใส่ URLของภาพ……");background-position: left center;background-repeat: no-repeat;background-attachment: fixed;background-color: "……ใส่สีพื้นหลัง……";}</style> โค้ดใส่รูปให้รูปอยู่มุมซ้ายบน <style>Body {background-image:url(".…..ใส่ URL ของรูป….");background-position: left top;background-repeat: no-repeat;background-attachment: fixed;background-color: "……ใส่สีพื้นหลัง……";}</style> :::ขอให้สนุกกับการแต่งบล็อกนะค่ะ:::   Create Date : 20 สิงหาคม 2552 25 comments Last Update : 20 สิงหาคม 2552 10:46:10 น. Counter : 1126 Pageviews. Share Tweet

ขอบคุณคะสำหรับสิ่งดีๆ ที่นำมาเสนอ อิอิ พึ่งหัดเล่น กิกิ   โดย: Mooaumza 20 สิงหาคม 2552 13:27:16 น.

แวะเข้ามาขอความรู้อีกแล้วจ้า ขอบคุณคร้าบบคุณครูที่น่ารัก   โดย: My Happiness 20 สิงหาคม 2552 14:16:36 น.

ขอบคุณมากๆเลยคะ   โดย: บุปผาลีลาวดี 20 สิงหาคม 2552 16:36:51 น.

แวะมาทักทายค่ะ สบายดีนะคะ Elbereth โค้ดธีมให้วางที่ช่อง Slogan แล้ว BG จะเหมือนกันทุก blog หรือเปล่าค่ะ   โดย: Elbereth 20 สิงหาคม 2552 17:05:08 น.

โดย: พรหมญาณี 21 สิงหาคม 2552 9:51:19 น.

ขอบคุณสำหรับ code ครับ เดี๋ยวจะลองเอาไปปรับใช้ดูครับผม ^^   โดย: คนจนที่อยากรวย 22 สิงหาคม 2552 11:38:31 น.

แอบมาดูของคุณน่ารักดี ของเรานะไม่มีอะไรเลยขอบอก   โดย: ชายเอ ทุ่งรังสิต 1 กันยายน 2552 1:59:52 น.

แวะมาดูคุณครูที่น่ารัก ที่เกิดวันนี้ ขอให้มีความสุขเนื่องในวันคล้ายเกิดทุกปีๆนะค๊ะ   โดย: ยายเก๋า (ชมพร ) 1 กันยายน 2552 22:03:54 น.

ป้าก็อยากเปลี่ยนทีมบ้างจังจ่ะ แต่ก็กลัวว่า จะทำให้บล๊อกอื่นๆของป้า เพี้ยนไปอ่ะจ่ะ นี่ป้าก็ขอร้องให้เจ้าลูกชายป้า เปิดบล๊อกขึ้นมาอีกบล๊อก เพื่อป้าจะได้ลองทำดู หรือนู๋เหมียวคิดว่ายังไงดีคะ... ช่วยป้าคิดทีน้า...   โดย: ป้าหู้เองจ่ะ (fifty-four ) 12 กันยายน 2552 17:09:27 น.

ขอบคุณค่ะ ได้แต่มอง แอบเข้ามาบ่อยๆ แต่ไม่กล้าซะที มันเป็นความแปลกใหม่นะ สำหรับคนที่เพิ่งจะเปิดใจรับเทคโนโลยี และอยากเรียนรู้ เพื่อจะตามโลก และคุยภาษาเดียวกันกับคนรุ่นใหม่ ขอบคุณอีกครั้งที่แบ่งปัน แอมอร   โดย: peeamp 13 กันยายน 2552 15:06:46 น.

สวัสดีค่ะ คุณแมว... ป้า-หาย คุณแมว-มา แล้วเมื่อไรจะเจ๊อะกันเสียที...เนอะ..อิ อิ   โดย: พรหมญาณี 14 กันยายน 2552 14:11:06 น.

ขอบคุณที่น้องเหมียว แนะนำป้าหู้นะจ๊ะ จู๊ฟ...จู๊ฟ...   โดย: ป้าหู้เองจ่ะ (fifty-four ) 14 กันยายน 2552 20:22:32 น.

อรุณสวัสดิ์ค่ะ วันนี้อากาศดี นกมาเกาะบนต้นลำใยหลังบ้าน ส่งเสียงเจื้อยแจ้ว ตื่นดีกว่า แอมอร   โดย: peeamp 15 กันยายน 2552 6:22:01 น.

โดย: พรหมญาณี 16 กันยายน 2552 11:18:23 น.

สวัสดีตอนเย็น ของวันสีเขียวค่ะ นู๋เหมียว ขอให้มีความสุข มากๆนะคะ วันนี้ป้าพาคนสำคัญ มาแนะนำให้รู้จักอ่ะจ่ะ   โดย: ป้าหู้เองจ่ะ (fifty-four ) 16 กันยายน 2552 18:11:56 น.

สบายดีน๊าขอรับ..   โดย: คนสาธารณะ 17 กันยายน 2552 3:19:48 น.

อรุณสวัสดิ์ค่ะ ขอให้เป็นเช้าที่สดชื่นนะคะ แอมอร   โดย: peeamp 17 กันยายน 2552 7:09:49 น.

สวัสดีค่ะ คุณแมว.... ป้ามาเป็นกำลังใจให้คุณแมว ทั้งหน้าไมค์และหลังไมค์เลย...ค่ะ มีความสุขมาก ๆ ในทุกวันดี ๆ...นะคะ   โดย: พรหมญาณี 17 กันยายน 2552 10:31:51 น.

มาแล้วมาแล้ว..เจ้าค่ะ.. ต้องขอโทษด้วยมีภาระกิจต้องทำเจ้าค่ะ หมวกที่ถักถวายพระเจ้าค่ะ   โดย: yoja 17 กันยายน 2552 12:14:40 น.

ขอบคุณสิ่งดีๆ ที่เอามาแบ่งปันกันนะคะ :)) Charlie มาชวนแวะไปชิมหมีผัดซอสแดง บ้าน Charlie กันนนน:))   โดย: sierra whiskey charlie 17 กันยายน 2552 20:27:28 น.

แวะมาตอนมืดๆ คืนนี้ อย่านอนดึกน้า ระวัง กุก กุก กู๋ แอมอร   โดย: peeamp 17 กันยายน 2552 22:37:51 น.

แวะมาศึกษาอีกค่ะ   โดย: My Happiness 18 กันยายน 2552 13:46:58 น.

กลับมาจาก ตจว. แย้ว คิดถุง มักๆ   โดย: พลังชีวิต 20 กันยายน 2552 17:11:32 น.

แวะมาอีกแล้วค่ะ พยักหน้าหงีก หงึก แต่ยังไม่ได้ลงมือทำซะที ยังไงก็ขอบคุณไว้ก่อนอะนะ ฝากตัวเป็นศิษย์ด้วยคน แอมอร   โดย: peeamp 21 กันยายน 2552 6:52:36 น.

สวัสดีค่ะ คุณแมว... ป้าไม่อยู่สองวัน คิดถึงคุณแมว...จัง คุณแมว สบายดี...นะคะ วันนี้ ปอ ป้า ขอเรียนเชิญทุกท่าน ร่วมกันถวายพระพรให้ในหลวงของเรา ขอให้พระองค์ทรงมีพระพลานามัยแข็งแรง หายจากอาการที่ทรงพระประชวรโดยเร็ววัน ขอพระองค์ทรงพระเจริญยิ่งยืนนาน เทอญ..   โดย: พรหมญาณี 21 กันยายน 2552 11:28:03 น.