เมื่อฉันได้ติดต่อกับ CSS ครั้งแรก ฉันรู้สึกสับสน หลายครั้งที่ฉันไม่รู้ว่าจะเริ่มต้นจากตรงไหนหรือจะเริ่มต้นอย่างไร หลังจากการเรนเดอร์แล้ว มีคำถามมากมายที่รบกวนจิตใจเรา: จะจัดวางมันอย่างไร? ตำแหน่งสัมบูรณ์หรือตำแหน่งสัมพัทธ์จะเลือกป้ายกำกับใด โครงสร้างอะไรที่จะนำมาใช้ .ฯลฯ แน่นอนว่าในกระบวนการเขียน Code เราจะเจอกับปัญหามากมาย โดยเฉพาะพวกเรามือใหม่ที่ไม่คุ้นเคยในทุกด้านและขาดประสบการณ์จึงมักจะขาดทุนเมื่อเจอปัญหา ฉันคิดว่าเมื่อเราเจอปัญหาเราต้องเรียนรู้ที่จะสรุปเพื่อหลีกเลี่ยงความผิดพลาดแบบเดิมในครั้งต่อไป
ต่อไปนี้เป็นข้อผิดพลาดทั่วไปที่ฉันสรุปไว้ในงานของฉัน:
และคำแนะนำในการแก้ปัญหาหวังว่าจะเป็นประโยชน์กับมือใหม่ CSS
1. ตรวจสอบว่ามีการสะกดผิดในองค์ประกอบ HTML หรือคุณลืมปิดแท็ก
แม้แต่ผู้เชี่ยวชาญที่เก่งที่สุดก็ยังทำผิดพลาดได้ เพราะเมื่อโครงสร้างของหน้าซับซ้อนมากและซ้อนอยู่ในหลายเลเยอร์ แท็กปิดก็อาจสูญเสียไปได้ง่าย โดยเฉพาะสำหรับคนอย่างฉันซึ่งคุ้นเคยกับการเขียนใน Notepad พวกเขามักจะทำผิดพลาดมากกว่า ดังนั้นควรระมัดระวังในการเขียน
2. ตรวจสอบว่า CSS ถูกต้องหรือไม่
โดยทั่วไป ข้อผิดพลาดที่พบบ่อยที่สุดใน CSS คือชื่อแอตทริบิวต์ในรูปแบบและ HTML ไม่สอดคล้องกัน ส่งผลให้มีการเขียนสไตล์ไว้อย่างชัดเจนแต่ก็ไม่มีผลใดๆ
3. ใช้พื้นหลังเพื่อค้นหาเลเยอร์ที่เกี่ยวข้อง
เมื่อเรากำลังแก้ไขข้อผิดพลาด โดยเฉพาะอย่างยิ่งเมื่อแก้ไขความเข้ากันได้ของเบราว์เซอร์ มีเลเยอร์ที่ซ้อนกันหลายชั้น ซึ่งมีแนวโน้มที่จะไม่ตรงแนวและทับซ้อนกัน ในเวลานี้ เราได้เพิ่มสีพื้นหลังให้กับเลเยอร์หลักเพื่อแสดงความแตกต่าง ซึ่งจะช่วยขจัดข้อผิดพลาด
4. กำหนดตำแหน่งข้อผิดพลาดโดยวิธีการกำจัด
เมื่อเราเขียนโค้ด CSS เรามักจะดำเนินการเล็กน้อยแล้วดูตัวอย่าง หากเกิดข้อผิดพลาดในขณะนี้ เราสามารถลบเลเยอร์ที่เพิ่มใหม่ได้จนกว่าจะแสดงตามปกติเพื่อพิจารณาว่าเลเยอร์ใดที่ปัญหาอยู่
5. องค์ประกอบ float จะต้องระบุแอตทริบิวต์ width
เบราว์เซอร์จำนวนมากมีข้อบกพร่องเมื่อแสดงองค์ประกอบลอยที่มีความกว้างที่ไม่ระบุ ดังนั้นไม่ว่าเนื้อหาขององค์ประกอบ float จะเป็นเช่นไร จะต้องระบุแอตทริบิวต์ width ให้กับองค์ประกอบนั้น
6. ลบสไตล์ที่ซ้ำกัน
หลายครั้งที่เราประกาศสไตล์สาธารณะไว้ที่หัวแล้วลืมมันไปเมื่อเราเขียนไว้ด้านล่าง ตัวอย่างเช่น เราประกาศ img{border:none;} ที่จุดเริ่มต้น
แล้วพอเจอแท็ก img ก็เขียนใหม่อีกครั้ง ควรหลีกเลี่ยงสถานการณ์นี้
7. ใส่ใจกับรูปแบบการเข้ารหัส
ภายใต้สถานการณ์ปกติ รูปแบบการเข้ารหัสที่เราใช้คือ: gb2312 และ UTF8 ไม่มีความแตกต่างระหว่างความดีและความชั่ว แต่อย่าผสมมัน โปรแกรมแก้ไขจำนวนมากใช้ค่าเริ่มต้นเป็นรูปแบบ UTF8
8. การเขียนลำดับรูปแบบลิงค์
หลังจากที่หลายๆ คนเขียนสไตล์ลิงก์ สีหลังจากการคลิกยังไม่ใช่สิ่งที่พวกเขาต้องการ ในขณะนี้ พวกเขาจำเป็นต้องตรวจสอบลำดับการเขียนสไตล์ลิงก์ ลำดับการเขียนที่ถูกต้องควรเป็น: LVHA