📜  如何在 CSS 中为 a:before 和 a:after 编写 :hover 条件?

📅  最后修改于: 2021-11-09 09:16:31             🧑  作者: Mango

CSS 中的:before:after选择器用于在元素前后添加内容。 :hover 是伪类,:before & :after 是伪元素。在 CSS 中,伪元素写在伪类之后。

句法:

a:hover::before {
    // CSS Property
}
a:hover::after {
    // CSS Property
}

在 CSS3 中,双冒号 (::) 用于表示伪元素。对于 IE8 或更早版本,使用单个冒号(CSS2 语法)。

示例 1:此示例对元素中的 a:before 和 a:after 使用 :hover 条件。



   
       
           :hover condition for a:before
           and a:after 
       
      
      
   
     
   
       Hover here 
   

鼠标移动前:

鼠标移过后:

示例 2:此示例对元素中的 a:before 和 a:after 使用 :hover 条件。



    
        
            :hover condition for a:before
            and a:after 
        
         
        
    
     
    
         GeeksForGeeks 
    

鼠标移动前:

鼠标移过去后

HTML 是网页的基础,用于通过构建网站和 Web 应用程序进行网页开发。您可以按照此 HTML 教程和 HTML 示例从头开始学习 HTML。

CSS 是网页的基础,用于通过样式化网站和 Web 应用程序进行网页开发。您可以按照此 CSS 教程和 CSS 示例从头开始学习 CSS。