รวมโคด และ จาวาสคริป+ลูกเล่นน่ารักๆให้กับพื้นหลัง





สวัสดีค่ะ...เป็นโคดที่เกียวกับพื้นหลังสำหรับแต่งบล็อคเท่าที่ ..จขบ.พอจะทราบค่ะ..
ขอบคุณเพื่อนๆๆที่แวัมาทักทนย จขบ.ทุกๆคนนะคะ..ขอบคุณค่ะ








Create Date : 30 กันยายน 2551
Last Update : 30 กันยายน 2551 17:32:09 น.
Counter : 9578 Pageviews.		  
6 comments
Share
  








ใส่พื้นหลังโดยใช้โคดสี

<style>body{background:#ffffff}></style>


ใส่พื้นหลังโดยใช้รูป

<style>body{background-image:url("ใส่..//..ของแบล็คกราว์ด");}</style>
<style>body{background-attachment: fixed;}</style>



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


lozocat
ใส่แบบรูปเดียวแถวบน  มุมซ้ายของหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) no-repeat fixed left top;background-color:#ffffff;}--></style>



lozocat
ใส่แบบรูปเดียวแถวบน  ตรงกลางของหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) no-repeat fixed center top;background-color:#ffffff;}--></style>



lozocat
ใส่แบบรูปเดียวแถวบน  มุมขวาของหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) no-repeat fixed right top;background-color:#ffffff;}--></style>



lozocat
ใส่แบบรูปเดียวแถวกลางด้านซ้ายของหน้าคอม 
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) no-repeat fixed left center;background-color:#ffffff;}--></style>



lozocat
ใส่แบบรูปเดียวแถวกลางตรงกลางของหน้าคอม 
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) no-repeat fixed center center;background-color:#ffffff;}--></style>



lozocat
ใส่แบบรูปเดียวแถวกลางด้านขวาของหน้าคอม 
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) no-repeat fixed right center;background-color:#ffffff;}--></style>



lozocat
ใส่แบบรูปเดียวแถวล่าง มุมซ้ายของหน้าคอม 
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) no-repeat fixed left bottom;background-color:#ffffff;}--></style>



lozocat
ใส่แบบรูปเดียวแถวล่าง ตรงกลางของหน้าคอม 
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) no-repeat fixed center bottom;background-color:#ffffff;}--></style>



lozocat
ใส่แบบรูปเดียวแถวล่าง มุมขวาของหน้าคอม 
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) no-repeat fixed right bottom;background-color:#ffffff;}--></style>





โดย: lozocat วันที่: 30 กันยายน 2551 เวลา:17:42:41 น.
  







 
 
ใส่แบบเรียงกันในแนวนอนแถวบนของหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) repeat-x fixed left top;background-color:#ffffff;}--></style>



 
 
 
ใส่แบบเรียงกันในแนวนอนตรงกลางของหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) repeat-x fixed center center;background-color:#ffffff;}--></style>




 
 
 
ใส่แบบเรียงกันในแนวนอนตอนล่างของหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) repeat-x fixed center bottom;background-color:#ffffff;}--></style>



   
ใส่แบบเรียงกันในแนวตั้งด้านซ้ายของหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) repeat-y fixed left top;background-color:#ffffff;}--></style>



   
ใส่แบบเรียงกันในแนวตั้งตรงกลางของหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) repeat-y fixed center bottom;background-color:#ffffff;}--></style>




   
ใส่แบบเรียงกันในแนวตั้งด้านขวาของหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) repeat-y fixed right bottom;background-color:#ffffff;}--></style>



 
ใส่แบบให้เรียงกันเต็มหน้าคอม
<style type="text/css"><!--body{background:url(...ใส่..//..ของแบล็คกราว์ด..) repeat fixed right bottom;background-color:#ffffff;}--></style>


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

lozocat


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


สมมุตุนี่คือ  รูปพื้นหลัง  และ  โคดสี
  lozocat +ffccff
เมื่อวางโคดแล้วก็จะมีหน้าคอมแบบที่เห็นด้านล่างค่ะ


ลูกเล่นน่ารักๆๆระหว่างรูปพื้นหลังและโคดสี
<style>body{background:#ffccff}></style>
<style>body{background-image:url("ใส่..//..ของแบล็คกราว์ด");}</style><style>body{background-attachment: fixed;}</style>

เพื่อนๆสามารถเข้าไปเลือกแบบและดูรูปพื้นหลังดุ๊กดิ๊กแบบน่ารักๆๆๆๆๆโดยคลิกที่หมายเลขด้านล่างค่ะ

lozocatlozocatlozocatlozocat
 








โดย: lozocat วันที่: 30 กันยายน 2551 เวลา:17:46:22 น.
  
โดย: lozocat วันที่: 30 กันยายน 2551 เวลา:18:42:15 น.
  
ขอบคุณคะน่าสนใจมากๆๆคะ
โดย: หนึ่งคิด วันที่: 30 กันยายน 2551 เวลา:19:18:32 น.
  
ขอบคุนค่ะแต่ยากจางรุย
โดย: หมูฟ้าใส (หมูฟ้าใส ) วันที่: 6 ตุลาคม 2551 เวลา:22:42:12 น.
  
ทักทายค่ะ ใจดีจังแวะมาเยี่ยมและขอแอดเป็นเพื่อนด้วยนะคะ
โดย: ต้นอ้อท้าลม วันที่: 26 กุมภาพันธ์ 2552 เวลา:19:50:23 น.
ชื่อ : * blog นี้ comment ได้เฉพาะสมาชิก
Comment :
 *ส่วน comment ไม่สามารถใช้ javascript และ style sheet
 

Misscat.BlogGang.com

lozocat
Location :
  

[ดู Profile ทั้งหมด]
 ผู้ติดตามบล็อก : 13 คน [?]

บทความทั้งหมด