홈>
우리는 일부 유틸리티를 만들려고 노력하고 있으며 'u :'를 사용할 때 이전에 접두사를 지정 했으므로 HTML에서 다음과 같이 보일 것입니다.
<div class="u:bg-red"></div>
오늘 우리는이 예제에서 접두사를 삭제하고 'bg-red'만 사용하려고했지만 SASS는 빈 클래스 이름을 허용하지 않습니다.
이것은 현재 우리가 생성하는 방법입니다 :
.u\: {
@include group();
}
(포함 된 그룹은 모든 유틸리티를 포함하는 믹스 인입니다)
실제 속성은 믹스 인으로 설정되며 다음과 같습니다 :
&bg-red {
...
}
믹스 인에 점을 추가하지 않는 이유는 다음을 사용하여 반응 형 유틸리티를 생성하기 때문입니다.
.u\@lg\: {
@include screen-large() {
@include group();
}
}
기본적으로 다음을 수행하고 싶습니다.
. {
@include group();
}
.\@lg\: {
@include screen-large() {
@include group();
}
}
그러나 SASS는 빈 클래스 이름을 허용하지 않습니다. 우리는 모든 종류의 탈출을 시도했지만 영리하지만 성공하지 못했습니다!
가장 가까운 것은 :
.\ {
}
그러나 속성 앞에 공백이 생깁니다.
제안 해 주셔서 감사합니다!
-
답변 # 1
관련 자료
- flutter - 빈 arb 템플릿을 생성하는 intl 현지화
- php - 워드 프레스 검색에서 빈 분류법을 검색하는 방법
- 배열 VBA/SQL에서 빈 값 허용
- Vue-Router를 사용할 때 Laravel 앱에서 빈 CSS 파일을 생성하는 Webpack
- excel - 교차 방법으로 빈 셀을 허용하지 마십시오
- aws cdk - CfnCrawler에 대한 빈 대상을 생성하는 CDK
- xcode - ipa 생성 오류 - "제거 디렉토리가 비어 있지 않습니다"
- reactjs - 왜 타이프 스크립트로 빈 상태 객체를 덮어 쓸 수 있습니까?
- Phalcon PHP 유효성 검사 고유성이지만 빈 값 허용
관련 질문
- sass - CSS 둥근 삼각형 문제
- html - CSS 링크가 이상하게 작동하는 이유는 무엇입니까?
- html - CSS 절대 위치를 따르는 입력 (확인란)을 만드는 데 문제가 있습니다
- html - CSS 테두리 전환은 원하지 않는 추가 픽셀을 추가합니다
- CSS 변수의 값을 정의하기 위해 sass 변수를 사용할 수없는 이유
- css - 볼 SASS fade_in 효과 문제
- css - SCSS에서 두 범위 사이의 글꼴 크기를 얻는 방법은 무엇입니까?
- html - Sass 스타일이 적용되지 않습니다
- css - Flexbox 레이아웃 SCSS
- css - yml에 삽입 된 스타일 HTML 요소가 작동하지 않습니다
모든 사용 사례를 모르지만 이와 같은 것이 도움이 되겠습니까?