เมื่อเราเปิดดูหลาย ๆ เว็บไซต์ เราจะเห็นว่าในบางเว็บไซต์เมื่อเลื่อนเมาส์ไปเหนือข้อความในแถบนำทางคุณจะรู้สึกว่าคำนั้นขยับหรือสีของตัวอักษรจะเปลี่ยนไปหรือ
จะมีการโอเวอร์ไลน์ ดูฉันสิ คุณเข้าใจถึงผลกระทบของแถบนำทางในบล็อกของฉัน วันนี้ San Shao จะบอกวิธีบรรลุเป้าหมายนี้
ที่จริงแล้ว สิ่งนี้ง่ายมาก มันถูกนำไปใช้จริงโดยใช้ CSS โปรดทำตามขั้นตอนของฉัน Let' Go!
1. เข้าสู่การจัดการพอร์ทัลส่วนบุคคลของคุณ เลือกการตั้งค่าพอร์ทัลส่วนบุคคล จากนั้นเลือกการเลือกเทมเพลต เลือก CSS แบบกำหนดเองเพื่อเข้าสู่
2. คุณเคยเห็นโค้ด CSS บ้างไหม กรุณาค้นหาโค้ดต่อไปนี้:
body{
margin-top: 0px;
ขอบขวา: อัตโนมัติ;
ขอบล่าง: 0px;
ขอบซ้าย: อัตโนมัติ;
ความกว้าง: 956px;
สีพื้นหลัง: #336666;
ขนาดตัวอักษร: 12px;
สี: #666666;
}#navi_bar และ:ลิงก์ {
/*สีข้อความของแถบนำทาง*/
}#navi_bar a:visited {}
เอาล่ะ ขั้นตอนสำคัญต่อไปนี้:
เพิ่มโค้ดต่อไปนี้หลังจากนี้:
#navi_bar a:hover{color:#000000; font-weight:bold;text-ตกแต่ง:blink;พื้นหลัง:#FF0000;font-size:18px}
#navi_bar {จอแสดงผล:บล็อก}
คำอธิบายโค้ด: 1. สีแสดงถึงสีของคำเมื่อเลื่อนเมาส์ และการตกแต่งข้อความแสดงถึงเอฟเฟกต์การปรับเปลี่ยนข้อความ โดยแอตทริบิวต์ที่สามารถเลือกได้คือ (ไม่มีหมายความว่า
ไฮเปอร์ลิงก์
ไม่มีการขีดเส้นใต้ ขีดเส้นใต้มี ขีดเส้นใต้ และโอเวอร์ไลน์จะเพิ่มไฮเปอร์ลิงก์ไปที่ข้อความเปลี่ยนเป็นบรรทัดผ่านเพื่อเพิ่มบรรทัดให้กับข้อความไฮเปอร์ลิงก์ และกะพริบเพื่อทำให้ข้อความ
กะพริบ
)ขนาดตัวอักษรแสดงถึงขนาดของแบบอักษร หากคุณต้องการทำให้แถบนำทางเป็นแบบไดนามิก ขนาดตัวอักษรที่นี่จะ
ใหญ่กว่าแบบอักษรใน navi_bar a:link ขนาดตัวอักษรในคำจำกัดความของ CSS คือ 14px ดังนั้นเราจึงต้องเลือก แบบอักษรที่มีขนาดใหญ่กว่า 14px
2.navi_bar a{display:block} หมายความว่าสีจะเต็มทั้งตาราง ไม่เช่นนั้นจะเติมได้เฉพาะข้อความเท่านั้น