วิธีปรับแต่งเมนูเว็บไซต์

สารบัญ:

วิธีปรับแต่งเมนูเว็บไซต์
วิธีปรับแต่งเมนูเว็บไซต์

วีดีโอ: วิธีปรับแต่งเมนูเว็บไซต์

วีดีโอ: วิธีปรับแต่งเมนูเว็บไซต์
วีดีโอ: สอนปรับเเต่งเว็บไซต์ Wordpress ทำเมนูเเบบ Transparent - เว็บระดับโลกชอบทำ 2024, พฤศจิกายน
Anonim

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

วิธีปรับแต่งเมนูเว็บไซต์
วิธีปรับแต่งเมนูเว็บไซต์

คำแนะนำ

ขั้นตอนที่ 1

คุณสามารถใช้ตัวควบคุมตัวสร้างไซต์เพื่อปรับแต่งเมนูใน Ucoz ดังนั้น คุณสามารถเปลี่ยนสีพื้นหลังของเทมเพลตที่เลือก สีของลิงก์ และข้อความในบล็อคเมนูได้ การแก้ไของค์ประกอบทั้งหมดทำได้ผ่านเมนูนักออกแบบ "การออกแบบ" - "การจัดการการออกแบบ (CSS)"

ขั้นตอนที่ 2

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

#navBar {ช่องว่างภายใน: 4px; พื้นหลัง: # 959595; ล้น: อัตโนมัติ; สี: แดง; }

ขั้นตอนที่ 3

รหัสนี้ตั้งค่าการเยื้องข้อความจากเส้นขอบของบล็อกที่สร้างขึ้น 4 พิกเซลในขณะที่พื้นหลังของเมนูได้รับค่า # 959595 ซึ่งสอดคล้องกับสีที่แน่นอนในรูปแบบ HTML พารามิเตอร์ overflow: auto ใช้เพื่อตั้งค่าการแสดงเนื้อหาที่ไม่พอดีกับพื้นที่ที่ระบุ พารามิเตอร์นี้ไม่ควรแก้ไขโดยไม่จำเป็น ตัวเลือกสีตั้งค่าองค์ประกอบเนื้อหาของบล็อกเป็นสีแดง

ขั้นตอนที่ 4

ในการแก้ไขพารามิเตอร์ของลิงก์ คุณสามารถใช้ตัวเลือกที่อยู่ในบล็อคโค้ดเดียวกันได้ เปลี่ยน #navBar ลิงก์ a: (ลิงก์ปกติ) a: ใช้งานอยู่ (สีของลิงก์หลังจากคลิก) a: เยี่ยมชมแล้ว (ลิงก์ที่เข้าชมแล้ว) และ a: โฮเวอร์ (สีของลิงก์หลังจากวางเมาส์เหนือ) ตามที่คุณต้องการ เปลี่ยนสีของแอตทริบิวต์สีและแก้ไขพารามิเตอร์การตกแต่งข้อความซึ่งกำหนดแอตทริบิวต์สำหรับข้อความ ค่าสำหรับตัวเลือกนี้สามารถขีดเส้นใต้, กะพริบ, ขีดเส้น, ขีดเส้นใต้

ขั้นตอนที่ 5

หลังจากแก้ไขแล้ว ให้คลิกปุ่ม "บันทึก" ในทำนองเดียวกัน เปลี่ยนบรรทัด.subColumn (พื้นหลังสำหรับแสดงรายการเมนูแนวตั้ง),.boxTable (ชื่อบล็อกเมนู),.boxContent (เนื้อหาของรายการลิงก์เมนู),.uMenuV (รายการเมนูแนวตั้ง) ตามที่คุณต้องการ คุณสามารถลบพารามิเตอร์ที่ไม่จำเป็นและแทรกโค้ด CSS ของคุณเองได้ รวมถึงแก้ไขสีขององค์ประกอบอื่นๆ ในการออกแบบ

ขั้นตอนที่ 6

บันทึกการเปลี่ยนแปลงและดูผลลัพธ์โดยไปที่หน้าเว็บไซต์ของคุณ การแก้ไขรายการเมนู Ucoz เสร็จสมบูรณ์