반응형
What does '&.' in '&.sub-title' indicates in scss?
I am a newbie to CSS and SCSS.
In the following code,
.title {
width: 718px;
&.sub-title {
width: 938px;
}
}
What does &. means? Is it same as nesting class?
The &
concatenates the parent class, resulting in .title.sub-title
(rather than .title .sub-title
if the &
is omitted).
The result is that with the &
it matches an element with both title
and sub-title
classes:
<div class='title sub-title'></div> <!-- << match -->
whilst without the &
it would match a descendent with class sub-title
of an element with class title
:
<div class='title'>
...
<div class='sub-title'></div> <!-- << match -->
...
</div>
ReferenceURL : https://stackoverflow.com/questions/9988558/what-does-in-sub-title-indicates-in-scss
반응형
'program tip' 카테고리의 다른 글
C의 EOF (파일 끝) (0) | 2020.12.24 |
---|---|
git에게 인덱스 만 숨기라고 어떻게 말합니까? (0) | 2020.12.24 |
How do you “Mavenize” a project using Intellij? (0) | 2020.12.24 |
Return the current user with Django Rest Framework (0) | 2020.12.24 |
How to create an empty matrix in R? (0) | 2020.12.24 |