0

我在网上探索并在此页面中找到了一个 css 代码：

复选框自定义样式

一段代码：

.input-helper {
    position: relative;
    display: inline-block;
    margin-bottom: 5px;

    &:before {
        content: '';
        display: block;
        position: absolute;
    }
}

但是&代码中有一个标志，我不知道它是什么。我认为它就像一个“名称持有者”、“名称参考”。
有人可以描述 CSS 中的 & 含义吗？

4

3 回答 3

4

这是一个Sass / LESSself变量，在这种情况下是指.input-helper

编译&:before时变成.input-helper:before

于 2013-10-21T13:28:44.547 回答
2

就像.input-helper:before，它是一个 Less/Sass 变量

于 2013-10-21T13:30:16.283 回答
1

If you've been using Sass for any length of time, then you're likely to be familiar with being able to reference parent selectors using the ampersand (&) character.

A simple Sass example looks like this:

h3
  font-size: 20px
  margin-bottom: 10px
  &.some-selector
    font-size: 24px
    margin-bottom: 20px

And here's how the output CSS looks.

h3 {
  font-size: 20px;
  margin-bottom: 10px;
}
h3.some-selector {
  font-size: 24px;
  margin-bottom: 20px;
}

So, in your case, you will get this following code:

.input-helper {
    position: relative;
    display: inline-block;
    margin-bottom: 5px;
}

And 

.input-helper:before{
        content: '';
        display: block;
        position: absolute;
    }
}

See more information

于 2013-10-21T13:31:44.273 回答