เนื้อหา

• คำสั่ง
• มุ่งหน้าไป {
• เคล็ดลับ
• การเตือน

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

คำสั่ง

ไซต์ใช้ทั้ง HTML และ CSS เพื่อกำหนดรูปลักษณ์และสไตล์ (รูปภาพ Comstock / Comstock / Getty)

1. ค้นหาที่เก็บ CSS ของเว็บเพจ โค้ด CSS อาจปรากฏแบบอินไลน์ซึ่งหมายความว่าการประกาศสไตล์แสดงเป็นส่วนหนึ่งของการทำเครื่องหมายองค์ประกอบเช่นเดียวกับในไวยากรณ์ของตัวอย่างต่อไปนี้: เนื้อหา

   หากรหัสนี้ปรากฏภายใน "div" ของคุณคุณสามารถลบแอตทริบิวต์ "style" ทั้งหมดด้วยค่าของมัน รหัส CSS อาจปรากฏขึ้นภายในส่วน "หัว" ของหน้าดังนี้: body {background-color: # 000000;}

   รหัส CSS อาจปรากฏในไฟล์ CSS แยกต่างหากหนึ่งไฟล์ขึ้นไปพร้อมลิงก์ในส่วน "head" ของหน้าดังนี้

2. หากหน้าของคุณมีรหัส CSS ในส่วน "หัว" หรือในไฟล์แยกคุณจะต้องค้นหารหัส CSS ทั้งหมดเพื่อเปลี่ยนสไตล์สำหรับองค์ประกอบ "div" ของคุณ

3. ตรวจสอบรหัส CSS ที่อ้างอิงถึงองค์ประกอบ "div" CSS สามารถนำไปใช้กับประเภทองค์ประกอบเช่นต่อไปนี้: div {padding: 5px; }

   
   

   หาก CSS ใน "ส่วนหัว" ของหน้าของคุณหรือไฟล์แยกมีตัวระบุ "div" ที่ใช้ในวิธีนี้รหัสภายในบล็อก CSS จะมีผลกับองค์ประกอบของมัน ในการเปลี่ยนเอฟเฟกต์ "div" ของคุณ แต่ให้โค้ดถูกนำไปใช้กับองค์ประกอบ "div" อื่น ๆ ในเว็บไซต์คุณสามารถเปลี่ยน "div" เป็นประเภทองค์ประกอบอื่นได้ หรือคุณสามารถเปลี่ยนรหัส CSS ที่จะใช้เฉพาะกับองค์ประกอบ "div" ด้วยแอตทริบิวต์ class เฉพาะโดยเพิ่มแอตทริบิวต์นี้ในองค์ประกอบ "div" เหล่านั้นที่คุณต้องการให้ CSS ถูกนำไปใช้

4. ตรวจสอบรหัส CSS ที่อ้างอิงถึงคลาสขององค์ประกอบของคุณ องค์ประกอบ HTML มีแอตทริบิวต์คลาสดังนี้เนื้อหายอดนิยม

   หาก "div" ของคุณมีแอตทริบิวต์ class ให้ดูค่าของแอตทริบิวต์ในรหัส CSS ของคุณ อาจปรากฏในแอตทริบิวต์ของตนเองดังต่อไปนี้: .top {/ประกาศ CSS/ }

   หรืออาจปรากฏพร้อมกับประเภทองค์ประกอบดังนี้: div.top {/ประกาศ CSS/ }

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

   
   

5. ตรวจสอบรหัส CSS สำหรับ ID องค์ประกอบของคุณ องค์ประกอบของคุณอาจมีแอตทริบิวต์ ID ที่ไม่ซ้ำกันดังต่อไปนี้: เนื้อหายอดนิยม

   หากองค์ประกอบของคุณมีแอตทริบิวต์ ID ให้ค้นหาภายใน CSS ค้นหาไวยากรณ์ต่อไปนี้:

   มุ่งหน้าไป {

   /ประกาศ CSS/ }

   ภายในแต่ละหน้าค่าแอตทริบิวต์ ID ควรปรากฏเพียงครั้งเดียวเนื่องจาก ID ต้องไม่ซ้ำกัน การเปลี่ยนค่าของแอตทริบิวต์ ID ควรป้องกันไม่ให้โค้ด CSS มีผลต่อองค์ประกอบ "div" คุณยังสามารถเลือกที่จะเปลี่ยนหรือลบรหัส CSS แต่สิ่งนี้อาจส่งผลกระทบต่อองค์ประกอบที่มี ID เดียวกันในหน้าอื่น ๆ ในเว็บไซต์ของคุณหากพวกเขาใช้รหัส CSS เดียวกัน

6. ค้นหารหัส CSS ที่ส่งผลต่อองค์ประกอบหลักหรือลูกของ "div" ของคุณ รหัส CSS สำหรับองค์ประกอบหลักจะมีปฏิกิริยากับ "div" ของคุณดังนั้นคุณอาจต้องทำการเปลี่ยนแปลงรหัสนี้แม้ว่าอาจมีผลกระทบต่อส่วนที่เหลือของไซต์ของคุณ องค์ประกอบภายใน "div" ของคุณอาจมีการดัดแปลงโค้ด CSS ตรวจสอบโดยใช้วิธีเดียวกับที่ใช้สำหรับ "div" ของตัวเองโดยทำงานกับองค์ประกอบย่อยแต่ละรายการพร้อมกัน

เคล็ดลับ

• เครื่องมือเบราว์เซอร์เช่น Firebug จะมีประโยชน์เมื่อเปลี่ยน HTML และ CSS

การเตือน

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