现代 CSS

::marker

聊聊CSS的::marker

CSS的::marker是一个伪元素,最早接触时间应该是在四年前。四年前在《试探列表中的::marker》一文中就提到过CSS的::marker伪元素,只不过在当时,该伪元素只是大家探索性的在聊该属性,而时至今日却不同,Firefox 68已经追随Safari11.1对该伪元素支持了。也就是说,该伪元素离我们越来越近了,以后我们可以使用::marker帮我们做更多的处理。简而言之,使用::marker伪元素,可以对列表做一些有趣的事情,在本文中,我们将深入的聊聊该伪元素。

试探列表中的::marker

前几天有位同学问过一个问题,<li>元素中的子元素浮动(float:left)之后,列表的项目符号会跑到浮动元素的后面。这个问题似乎在三年前碰到过,但又有那么点不一样。后来查阅相关文档,了解到,造成这个问题就是列表中的::marker造成。虽然将来能解决,但在浏览器还没有支持这个属性之前,我们也只能另寻途径,先解决问题,感兴趣的同学可以先跟我一起初探::marker

返回顶部