相同點
都可以用來表示偽類對象,用來設置對象前的內容
:before和::before寫法是等效的; :after和::after寫法是等效的
不同點
:before/:after是Css2的寫法,::before/::after是Css3的寫法
:before/:after 的兼容性要比::before/::after好 ,
不過在H5開發中建議使用::before/::after比較好
注意
這些偽元素 要配合content屬性一起使用
這些偽元素 不會出現在DOM中,所以不能通過js來操作,僅僅是在 CSS 渲染層加入
這些偽元素 的特效通常要使用:hover偽類樣式來激活
eg:當鼠標移在span上時,span前插入”111111”
<style>
span{
background: yellow;
}
span:hover::before{
content:"111111";
}
</style>
<span>222</span>