伪元素中::after和::before的运用

特性

• 都作为标签内部的最后一个/第一个子元素
• 行内元素
• content属性必填(没有直接’’)

使用场景

• 文字前边的图标

    这是一个图片

• 导航的跟随线

   

       

           
我是一个列表项
           
我也是一个
       
   

-清除浮动的影响

在ul后加上一个子元素来清除浮动影响

ul::after {
            content: '';
            display: block;
            clear: both;
        }

ps:左边和上边的是padding与margin的自带距离,使用全局*{margin:0;padding:0;}即可