เพิ่มสีสวยให้ tag

Labels Gadget สำหรับบล็อกมีความสำคัญสำหรับผู้ชมที่เข้ามาอ่านบทความมากเพราะว่า Labels จะรวมกลุ่มบทความที่มีความสัมพันธ์กันไว้เป็นหมวดๆ ใน Blogger การแสดง Labels จะมีวิธีแสดงอยู่สองแบบให้เราเลือก คือแบบ "List" และ "Cloud" ซึ่งการแสดงแบบ List จะสดวกในการใช้งานมากกว่าในกรณีที่ Labels น้อยๆ แต่เมื่อไหร่ก็ตามที่ Labels เรามากขึ้น ถ้าเราเลือกแสดงแบบ List. Labels จะยาวขึ้น จึงอาจจะจำเป็นที่จะต้องแสดงแบบ Cloud เพื่อให้ประหยัดพื้นที่
การแสดง Labels แบบ Cloud จะมีการเปลี่ยนแปลงขนาดของตัวอักษรขนาดต่างกันออกไป ซึ่งการเปลี่ยนขนาดของตัวอักษรจะขึ้นอยู่กับจำนวนของบทความในแต่ละ Labels จะเห็นว่า Labels ของบล็อก วิธีสร้างบล็อก และ รวยด้วยบล็อก Labels ของ Blog tutorial และ Blog Promote จะโตเนื่องจากบทความส่วนใหญ่ อยู่ใน Labels นี้ แต่การใช้งาน Cloud labels ส่วนตัวผมแล้วไม่น่าสนใจเท่าไหร่เนื่องจาก มองหากลุ่มบทความที่สนใจได้ลำบาก ก็เลยจำเป็นที่จะต้องสร้างความน่าสนใจ และสร้างความแตกต่างให้ Labels ด้วยคุณลักษณะของอักษรใหม่

โดยปกติ Code ของ Cloud Labels ที่เรายังไม่ปรับแต่งจะเป็นดังนี้

.label-size-1 a { }
.label-size-2 a { }
.label-size-3 a { }
.label-size-4 a { }
.label-size-5 a { }

ซึ่งจะไม่มีความแตกต่างของตัวอักษรอย่างอื่นนอกจากขนาด ดังนั้นเราจึงสามารถกำหนดคุณลักษณะของตัวอักษรเพิ่มเติมได้ โดย CSS ของ วิธีสร้างบล็อก และ รวยด้วยบล็อก เป็นดังนี้

.label-size-1 a {
font-size: 12px;
text-decoration: none;
color:#DD7A04;
}
.label-size-2 a {
font-size: 14px;
text-decoration: none;
color:#6669e9;
}
.label-size-3 a {
font-size: 15px;font-family: Arial, Tahoma, Verdana;text-decoration: none;
}
.label-size-4 a {
font-size: 18px;
font-weight:bold;
text-decoration: none;
color:#8c8c9a;
}
.label-size-5 a {
font-size: 24px;
text-decoration: none;
}
.label-size-1 a:hover,
.label-size-2 a:hover,
.label-size-3 a:hover,
.label-size-4 a:hover,
.label-size-5 a:hover { text-decoration:underline }

ถ้าคุณต้องการที่จะปรับแต่งคุณลักษณะของตัวอักษร คุณสามารกทำได้โดยทำตามขั้นตอนต่อไปนี้
1. ล็อกอินเข้าไปแก้ไข HTML
2. Copy CSS code ข้างบนไปวางใน HTML โดยวางก่อน Code ]]></b:skin>
3. บันทึกแม่แบบ
จากนั้นถ้าคุณยังไม่ได้ Set การแสดงผล Display ให้เป็นแบบ Cloud ให้เข้าไปแก้ไขที่ Labals Gadget ดังรูป

Happy on this............

ขอขอบคุณ  gotogetmoney.blogspot.com 

by service