สมาชิก
แลกเปลี่ยน

การแต่งบล้อกง่าย ๆ สไตล์อิงจันทร์ " ภาพพื้นหลัง"

ครูอิงไม่ใช่ผู้เชี่ยวชาญนะคะ บันทึกนี้เขียนจากประสบการณ์ในการลองผิดลองถูกเท่านั้น ขออภัยผู้ที่แต่งบล็อกเก่งแล้วด้วยนะคะ มีอะไรก็ช่วยเม้นท์เพิ่มเติมด้วยนะคะ

 

       เมื่อบันทึกก่อนครูอิงได้เล่าประสบการณ์เรื่องการเปลี่ยนภาพที่หัวบล็อกไปแล้ว บันทึกนี้ครูอิงจะเล่าถึงประสบการณ์การทำภาพพื้นหลัง (BACKGROUND)

       บล็อก "ลานดินกลิ่นหญ้า" ที่เห็นอยู่ขณะนี้ ครูอิงใส่โค้ดนี้ใน CSS ค่ะ (เข้าไปที่จัดการบล็อก  เลือกตกแต่ง   เลือก แก้ไข  CSS ที่ตกแต่งมาเอง)

div#subtitle {background:#4F94CD;}

div#ribbon{background:#36648B;}

(1) div#page-wrapper {background-image: none;}

(2) div#page-wrapper {background-image:url(http://gotoknow.org/file/siriporn5633/suiren-4.jpg);} 

(3)div#title{font-size: big; color:#836FFF; background:#F0FFFF; background-image:url(http://gotoknow.org/file/ruschadawon/untitled305.GIF);background-repeat:no-repeat;background-position:bottom;   height:420px;}
 

(4) <STYLE>TABLE {background-color: transparent;border-style: none;border: 1;-spacing: none;}TD {border: none;border-color: none;background: none;}</STYLE><STYLE>body{background-image:url("http://gotoknow.org/file/ruschadawon/untitled293.jpg");}</STYLE><STYLE>body{background-attachment: fixed;}</STYLE>

 

ส่วนที่ (1) คือ ส่วนที่เราเขียนบันทึกค่ะ  เป็นส่วนที่เป็นเหมือนกล่องข้อความสีขาวพาดอยู่ตรงกลางหน่ะค่ะ เรียกว่า  page จะสังเกตว่าไม่ว่าจะใช้ธีมใด ก็จะเป็นสีขาว ถ้าเราต้องการตัดกล่องสีขาวออกไป ก็จะต้องใส่คำว่า -wrapper ต่อท้ายค่ะ หน้าบล็อกของเพื่อน ๆ ก็จะเป็นสีเดียวกับภาพพื้นหลังทั้งหมด ไม่มีพาดขาวตรงกลาง อย่างเช่นบล็อกของครูอิง บล็อกนี้หน่ะค่ะ http://gotoknow.org/blog/ruschadawon-taltal/303000 ลองคลิ๊กไปดูนะคะ หรือบล็อกนี้ก็ใช่ค่ะ http://gotoknow.org/blog/rimfaa/322471

ส่วนที่ (2) ครูอิงต้องการใส่ภาพพื้นหลัง ใน page ครูอิงก็ copy   (URL)  ของภาพคือเจ้าตัวนี้ http://gotoknow.org/file/siriporn5633/suiren-4.jpg ไปใส่ในวงเล็บหน่ะค่ะ(วิธีหา(URL) ของภาพอยู่ในบันทึกที่แล้วนะคะ) ก็จะได้พื้นหลังใน page เป็นลายดอกไม้สีฟ้า ๆ นี่ไงคะ ต้องไม่ลืมใส่-wrapper นะคะ

ส่วนที่ (3) ตรงนี้เป็นส่วนของหัวบล็อก ที่ครูอิงนำเสนอไปแล้ว เมื่อบันทึกที่แล้ว ผ่านเลยนะคะ

ส่วนที่ (4) ตรงนี้เป็นส่วนของด้านข้างทั้งสองข้าง ซึ่งของครูอิงจะเป็นภาพนี้ค่ะ

                                    Bg1-1

ไม่ทราบเพื่อน ๆ สังเกตกันหรือไม่ว่า ภาพพื้นหลังด้านข้างส่วนมากจะเลือนขึ้นเลื่อนลงได้ ครูอิงไม่ชอบเลยค่ะ ครูอิงอยากให้ มันหยุดอยู่กับที่ เมื่อครูอิงใส่ (URL) ของภาพคือเจ้าตัวนี้ http://gotoknow.org/file/ruschadawon/untitled305.GIF ไปในวงเล็บเสร็จ ครูอิงก็จะต่อท้ายด้วยคำนี้ค่ะ  fixed  แค่นี้ ภาพด้านข้างของครูอิงก็จะหยุดอยู่กับที่หล่ะค่ะ  ลองดูซิคะ 

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

         ส่วนมากครูอิงจะใช้บริการภาพพื้นหลังจากที่นี่ค่ะ http://www.bloggang.com/viewdiary.php?id=auntymod&month=07-2005&date=15&group=12&blog=1

ชอบพื้นหลังสีอะไร คลิ๊กเอา (URL) ไปเปลี่ยนในวงเล็บ  (4)

 









บันทึกนี้เขียนที่ GotoKnow โดย 

บันทึกก่อนนี้
บันทึกใหม่กว่า
· คำสำคัญ: ภาพพื้นหลัง 
· หมายเลขบันทึก: 307292 · เขียน:  
· ความเห็น:
20
 · อ่าน: แสดง
· สัญญาอนุญาต: ครีเอทีฟคอมมอนส์แบบ แสดงที่มา-ไม่ใช้เพื่อการค้า-อนุญาตแบบเดียวกัน
แจ้งลบ
แจ้งลบ
มนัสนันท์
เขียนเมื่อ Wed Oct 21 2009 07:30:48 GMT+0700 (ICT)

ขอบคุณสำหรับความรู้ดีๆนะคะ ครูพี่อิง จะลองนำไปตกแต่งดูนะคะ

ต่าย
เขียนเมื่อ Wed Oct 21 2009 07:36:44 GMT+0700 (ICT)

น่าสนใจค่ะ จะพยายามลองทำค่ะ

@space@
เขียนเมื่อ Wed Oct 21 2009 07:37:16 GMT+0700 (ICT)

พี่คงต้องศึกษานานหน่อย แต่จะลองดูค่ะ

ขอบคุณเคล็บลับที่นำมาแบ่งปันนะคะน้องสาว

 

nuch
เขียนเมื่อ Wed Oct 21 2009 10:32:22 GMT+0700 (ICT)

ขอบคุณสำหรับคำแนะนำค่ะ ได้ประโยชน์ดีค่ะ

nuch
เขียนเมื่อ Wed Oct 21 2009 16:46:06 GMT+0700 (ICT)

อีกครั้ง

เพลงเพราะจังเลยค่ะ เพลงอะไรค่ะ (บอกหน่อยได้ไหม)

ขอบคุณล่วงหน้าค่ะ

nuch
เขียนเมื่อ Wed Oct 21 2009 16:49:39 GMT+0700 (ICT)

อีกครั้ง

เพลงเพราะจังเลยค่ะ เพลงอะไรค่ะ (บอกหน่อยได้ไหม)

ขอบคุณล่วงหน้าค่ะ

อิงจันทร์ ณ เรือนปั้นหยา
เขียนเมื่อ Wed Oct 21 2009 18:28:59 GMT+0700 (ICT)

สวัสดีค่ะน้องแมว

          น้องแมวก็แต่งบล็อกเก่งออกค่ะ พี่อิงเคยเห็นมาแล้ว

         มีอะไรเพิ่มเติม เม้นท์ เสริมให้ด้วยนะคะ พี่อิงก็ งู ๆ ปลา ๆ ค่ะ

อิงจันทร์ ณ เรือนปั้นหยา
เขียนเมื่อ Wed Oct 21 2009 18:29:54 GMT+0700 (ICT)

สวัสดีค่ะ คุณต่าย

      ลองดูนะคะ ขอบคุณค่ะที่แวะเข้ามาทักทายกัน

อิงจันทร์ ณ เรือนปั้นหยา
เขียนเมื่อ Wed Oct 21 2009 18:30:54 GMT+0700 (ICT)

สวัสดีค่ะพี่ครูอี๊ด

          อยากได้แบบไหนบอกนะคะ  จะให้ช่วยทำให้ก็ โอ เค เลยค่ะ  ส่งมาทางเมลนะคะ

อิงจันทร์ ณ เรือนปั้นหยา
เขียนเมื่อ Wed Oct 21 2009 18:35:59 GMT+0700 (ICT)

สวัสดีค่ะคุณ nuch

          ครูอิงชอบเพลงนี้ที่มันเป็นภาษาใต้  และ จังหวะมันส์ดีค่ะ

          ชื่อเพลง รักมั้ย  ของ แอม  อินทิรา  ค่ะ

          ขอบคุณนะคะที่แวะมาฟังเพลง มากกว่า 1 รอบ  มีความสุขเสมอ ๆ นะคะ

ณัฐรดา
เขียนเมื่อ Wed Oct 21 2009 18:46:19 GMT+0700 (ICT)

สวัสดีค่ะ

ค่อยๆศึกษาค่ะ เดี๋ยวจะไปลองทำดูบ้างค่ะ

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

อิงจันทร์ ณ เรือนปั้นหยา
เขียนเมื่อ Wed Oct 21 2009 18:53:30 GMT+0700 (ICT)

สวัสดีค่ะ คุณ ณัฐรดา

         ลองดูนะคะ  ติดขัดอะไรก็เม้นท์ถามได้ค่ะ  ขอบคุณค่ะที่แวะมาทักทายกัน

หมูจ๋า
เขียนเมื่อ Wed Oct 21 2009 21:30:12 GMT+0700 (ICT)

ว้าว สุดยอดเลยหนูจะทำได้หรือเปล่าน๊อ

   เอารูปนี้มาฝากค่ะ

Hana สุวิญญา ธนสีลังกูล
เขียนเมื่อ Wed Oct 21 2009 21:58:09 GMT+0700 (ICT)

ขอบคุณมากๆๆค่ะครูอิง

กำลังพยายามทำ BG ค่ะ ตอนนี้เลยต้องศึกษาเรื่องโค้ดให้เข้าใจก่อน

ครูอิงอธิบายอ่านแล้วเข้าใจง่าย ดีมากๆๆเลยค่า

^____^

krutoom
เขียนเมื่อ Thu Oct 22 2009 12:04:39 GMT+0700 (ICT)

สวัสดีค่ะครูอิงนำเสนอได้ดีมากๆ..อยากหัดทำหัวบล็อกค่ะจะทำได้มั้ยหนอ....ครูอิงเก่งมากๆ..

บุญเย็น
เขียนเมื่อ Thu Oct 22 2009 12:08:32 GMT+0700 (ICT)

สวัสดีครับ เข้ามาเรียนรู้วิธีแต่งblog สวย ๆ แบบคุณครูอิงจันทร์ขอรับ ขอบคุณครับ

เด็กใหม่มือเพิ่งหัดทำวันนี้เอง ขอบคุณมากที่ให้ความรู้ แต่ได้ฟังเพลงแล้วอยากรู้วิธีการใส่เสียงเพลงบ้างค่ะ ขอคำแนะด้วยค่ะ เพลงไพเราะน่าฟังเพลินดี ทำให้นึกเห็นภาพคุณอิงเต็มรูปแบบว่า ถ้าร้องเพลงไปด้วยและเต้นด้วยนะแจ๋วจริง

ภาพที่โชว์เต้นเป็นคุณอิงด้วยนะน่ารักดีค่ะ

กานต์
เขียนเมื่อ Sat Oct 31 2009 12:14:53 GMT+0700 (ICT)

มาเรียนทำบล๊อก จากคุณครูค่ะ เก่งจัง ขอเป็นลูกศิษย์โค่งด้วยคน อยากทำอักษรให้ใหญ่กว่านี้สักนิด เปลี่ยนสีบล็อก ลูกเล่นต่างๆ รวมทั้งเสียเพลงด้วย คุณครูเก่งจริงๆ ขอแสดงความชื่นชมด้วยคน ขอบคุณล่วงหน้าค่ะ

 

 

กานต์
เขียนเมื่อ Sun Nov 01 2009 08:33:44 GMT+0700 (ICT)

มาชวนไปลอยกระทงค่ะ

poungharm
เขียนเมื่อ Thu Nov 19 2009 00:51:58 GMT+0700 (ICT)

สวัสดีค่ะคุณครูอิงจันทร์

  • เคยเห็นบล็อกของคุณครูสวย ๆ
  • นึกอยากทำบ้าง กะจะเข้ามาถาม
  • ก็พอดีมาได้เจอบันทึกของคุณครูได้เขียนแนะนำการตกแต่งบล็อกเอาไว้แล้ว
  • ดีใจมาก!!!!!!!!!!!!
  • ขออนุญาตเอาไปแต่งบล็อกของตนเองบ้างนะคะ
  • ขอบคุณคะ

 

อนุญาตให้แสดงความเห็นได้เฉพาะสมาชิก
ไม่อนุญาตให้แสดงความเห็น
{{ kv.current_user.preferred_name }} - เพิ่มความเห็นเพิ่มความเห็น
ใส่รูปหรือไฟล์