2. คลาสหลอกและองค์ประกอบหลอก
A.: ตัวเลือกลูกหลานที่อยู่เบื้องหลังโฮเวอร์
ตัวอย่าง
| A: Hover Span { สี: #0F0; - |
อธิบาย
องค์ประกอบสามารถวางตำแหน่งโดยตัวเลือกที่อยู่ด้านหลัง: โฮเวอร์หลอกคลาสเช่นเดียวกับตัวเลือกลูกหลาน ในตัวอย่างด้านบนเมื่อเมาส์วนเวียนอยู่สีของข้อความในองค์ประกอบ Span ในองค์ประกอบ A จะเปลี่ยนไป
สนับสนุน
| IE6 ไม่ IE7 ใช่ IE8 ใช่ |
B. โซ่หลอกหมวดหมู่
ตัวอย่าง
| A: ลูกคนแรก: โฮเวอร์ { สี: #0F0; - |
อธิบาย
คลาสหลอกสามารถถูกล่ามโซ่ไว้เพื่อ จำกัด การเลือกองค์ประกอบ ตัวอย่างข้างต้นจะค้นหาแท็กแรกภายใต้องค์ประกอบหลักแต่ละองค์ประกอบและใช้ P Pseudo-Class P กับมัน
สนับสนุน
| IE6 ไม่ IE7 ใช่ IE8 ใช่ |
C. ในบรรดาองค์ประกอบที่ไม่ใช่เครื่องวัด: โฮเวอร์
ตัวอย่าง
| div: โฮเวอร์ { สี: #f00; - |
อธิบาย
: Hover Pseudo-Class สามารถนำไปใช้กับสถานะโฮเวอร์ขององค์ประกอบใด ๆ ไม่ใช่แค่แท็ก A
สนับสนุน
| IE6 ไม่ IE7 ใช่ IE8 ใช่ |
D. : ชั้นหลอกเด็กคนแรก
ตัวอย่าง
| Div Li: ลูกคนแรก { ความเป็นมา: สีน้ำเงิน; - |
อธิบาย
คลาสที่ดัดแปลงโดยหลอกตั้งอยู่องค์ประกอบลูกแรกขององค์ประกอบหลักของแต่ละองค์ประกอบที่ระบุ
สนับสนุน
| IE6 ไม่ IE7 ใช่ IE8 ใช่ |
ข้อบกพร่อง
ใน IE7 หากองค์ประกอบลูกแรกที่จะอยู่มีความคิดเห็น HTML มาก่อนระดับ pseudo-class ลูกคนแรกจะไม่ถูกต้อง
E. : โฟกัสชั้นหลอก
ตัวอย่าง
| ตอบ: โฟกัส { ชายแดน: 1px ของแข็งสีแดง; - |
อธิบาย
ชั้นหลอกนี้ตั้งอยู่ที่องค์ประกอบทั้งหมดด้วยการโฟกัสแป้นพิมพ์
สนับสนุน
| IE6 ไม่ IE7 ไม่ IE8 ใช่ |
f,: ก่อนและ: หลังคลาสหลอก
ตัวอย่าง
| #Box: ก่อน { เนื้อหา: "ย่อหน้านี้อยู่ด้านหน้าของกล่อง"; - #Box: หลังจาก { เนื้อหา: "ย่อหน้านี้อยู่เบื้องหลังกล่อง"; - |
อธิบาย
องค์ประกอบหลอกสองตัวนี้เพิ่มเนื้อหาที่สร้างขึ้นก่อนและหลังองค์ประกอบที่ระบุและใช้ร่วมกับแอตทริบิวต์เนื้อหา
สนับสนุน
| IE6 ไม่ IE7 ไม่ IE8 ใช่ |
3. การสนับสนุนแอตทริบิวต์
A. ขนาดจริงที่เกิดจากตำแหน่ง
ตัวอย่าง
| #กล่อง { ตำแหน่ง: สัมบูรณ์; ด้านบน: 0; ขวา: 100px; ซ้าย: 0; ด้านล่าง: 200px; ความเป็นมา: สีน้ำเงิน; - |
อธิบาย
การกำหนดค่าด้านบน, ขวา, ล่างและซ้ายเป็นองค์ประกอบที่วางตำแหน่งอย่างแน่นอนจะให้ขนาดจริง (ความกว้างและความสูง) ขององค์ประกอบแม้ว่าจะไม่มีการตั้งค่าที่จะทำให้ค่าความกว้างและความสูง
สนับสนุน
| IE6 ไม่ IE7 ใช่ IE8 ใช่ |
B. ความสูงต่ำและต่ำสุด
ตัวอย่าง
| #กล่อง { ต่ำสุด: 500px; ความกว้างขั้นต่ำ: 300px; - |
อธิบาย
คุณสมบัติทั้งสองนี้ระบุค่าต่ำสุดของความกว้างและความสูงขององค์ประกอบทำให้กล่องมีขนาดใหญ่กว่าค่าต่ำสุดที่ระบุ แต่ไม่เล็กลง พวกเขาสามารถใช้ร่วมกันหรือแยกกัน
สนับสนุน
| IE6 ไม่ IE7 ใช่ IE8 ใช่ |
C, Max-Height และ Max-Width
ตัวอย่าง
| #กล่อง { สูงสุด: 500px; ความกว้างสูงสุด: 300px; - |
อธิบาย
คุณสมบัติทั้งสองนี้ระบุค่าสูงสุดของความสูงและความกว้างขององค์ประกอบทำให้กล่องมีขนาดเล็กกว่าค่าสูงสุดที่ระบุ แต่ไม่ใหญ่กว่า พวกเขายังสามารถใช้พร้อมกันหรือเป็นรายบุคคล
สนับสนุน
| IE6 ไม่ IE7 ใช่ IE8 ใช่ |