CSS中的&:: before,&::之后是什么？

Question

我想创建一个垂直时间轴,我遇到了这个页面.

我复制了代码,有些东西我遇到了麻烦.

我试图将其更改为样式表代码,但卡在这里.此外,css代码与传统的css文件包含的不同.这段代码是什么,我该如何使用它？

Answer 1

&::after 在CSS中实际上没什么,但它是SASS/SCSS的一个特性,可能写在这样的上下文中:

li {
  /* some style 1 */

  &::after {
    /* some style 2 */
  }

}

编译为:

li { /* some style 1 */ }
li::after { /* some style 2 */ }

基本上,SASS中的&符号在编译为CSS时会拉入父选择器.

编辑您不能在.css文件中使用&符号,因为它没有意义,您只能在使用SASS预处理器编译为CSS的sass/scss文件中使用它.

关于SASS中的&符号的博客文章(不是我的):

编辑2 更多答案:

一切是香草CSS, ::after,::before是伪构件,.relative并且.radio是类选择,:checked是一个伪类输入类型的无线电和复选框,+是相邻的兄弟选择器

MDN应该是(一个)CSS文档的权限,所以我选择链接到他们的页面而不是简单地将他们文档的内容复制并粘贴到这个答案中.

那么`:after`是什么意思呢？还是`:before`？还是`:checked`？还是`+`？或`.relative`？或`.radio`？你只触及了问题所问的问题之一。 (2认同)