: after vs. :: after

มีความแตกต่างในการทำงานระหว่าง CSS 2.1 :afterและ::afterตัวเลือกหลอกCSS 3 หรือไม่(นอกเหนือจาก::afterไม่รองรับในเบราว์เซอร์รุ่นเก่า) มีเหตุผลในทางปฏิบัติที่จะใช้ข้อกำหนดใหม่กว่านี้หรือไม่?

มันเป็นความแตกต่างขององค์ประกอบระดับหลอกเทียบกับเทียม

ยกเว้นสำหรับ::first-line, ::first-letter, ::beforeและ::after(ซึ่งได้รับรอบเล็ก ๆ น้อย ๆ ในขณะที่และสามารถใช้กับทวิภาคเดียวถ้าคุณต้องการการสนับสนุน IE8) หลอกองค์ประกอบ ต้องทวิภาคคู่

Pseudo-class จะเลือกองค์ประกอบที่แท้จริงด้วยตัวเองคุณสามารถใช้:first-childหรือ:nth-of-type(n)เพื่อเลือกรายการแรกหรือเฉพาะ<p>ใน div ได้เช่น
(และสถานะขององค์ประกอบจริงเช่น:hoverและ:focus)

องค์ประกอบ Pseudoกำหนดเป้าหมายส่วนย่อยขององค์ประกอบเช่น::first-lineหรือ::first-letterสิ่งที่ไม่ใช่องค์ประกอบตามสิทธิ์ของตนเอง

คำอธิบายที่ดีกว่าที่นี่: http://bricss.net/post/10768584657/know-your-lingo-pseudo-class-vs-pseudo-element
นอกจากนี้ที่นี่: http://www.evotech.net/blog/2007/ 05 / หลังวีหลังจากสิ่งที่เป็นคู่-ลำไส้ใหญ่สัญกรณ์ /

CSS Selectors เช่น::afterเป็นองค์ประกอบเสมือนบางอย่างที่ไม่มีให้เป็นองค์ประกอบที่ชัดเจนในโครงสร้าง DOM พวกเขาจะเรียกว่า " Pseudo องค์ประกอบ " และจะใช้ในการแทรกเนื้อหาบางส่วนก่อน / หลังองค์ประกอบ (เช่น::before, ::after) หรือเลือกบางส่วนขององค์ประกอบ (เช่น: ::first-letter) ปัจจุบันมีเพียง 5 องค์ประกอบหลอกมาตรฐาน: after, before, first-letter, first-line, selection.

บนมืออื่น ๆ มีชนิดอื่น ๆ ของตัวเลือกที่เรียกว่า " Pseudo-เรียน " ซึ่งถูกนำมาใช้ในการกำหนดสถานะพิเศษขององค์ประกอบ (เหมือน:hover, :focus,:nth-child(n) ) สิ่งเหล่านี้จะเลือกองค์ประกอบที่มีอยู่ทั้งหมดใน DOM ชั้นเรียนหลอกเป็นรายการยาวที่มีมากกว่า 30 รายการ

เริ่มแรก (ใน CSS2 และ CSS1) ไวยากรณ์จุดเดียวถูกใช้สำหรับทั้งคลาสหลอกและองค์ประกอบหลอก แต่ใน CSS3 ::ไวยากรณ์แทนที่:สัญกรณ์สำหรับองค์ประกอบหลอกเพื่อให้แยกแยะได้ดีขึ้น

สำหรับความเข้ากันได้แบบย้อนหลังไวยากรณ์ single-colon แบบเก่าเป็นที่ยอมรับสำหรับองค์ประกอบหลอกเช่น as :after(เบราว์เซอร์ทั้งหมดยังคงรองรับไวยากรณ์แบบเก่าที่มีเครื่องหมายอัฒภาคเดียว) เฉพาะ IE-8 ไม่รองรับไวยากรณ์ใหม่ (ใช้ single-colon หากคุณต้องการรองรับ IE8)