CSS의 네임 스케이싱/스코핑

StackOverflow https://stackoverflow.com/questions/1432306

  •  07-07-2019
  •  | 
  •  

문제

CSS 파일의 규칙을 특정 div/클래스에 적용하고 싶습니다. 예를 들어, 이벤트의 내용은 이벤트의 내용을 추가 할 필요 없이이 범위를 벗어난 클래스의 내용에만 적용됩니다. 클래스 .Events 각 CSS 규칙의 시작까지.

나는 이것이 불가능하다고 생각하지만 당신은 결코 알지 못합니다.

그렇지 않은 경우 업로드/편집 한 후 CSS 규칙에 .events를 접두사로하여 동일한 효과를 달성 할 생각입니다. 나는 이것이 상당히 문제가 없어야한다고 생각하지만 아무도 문제를 포기합니까?

도움이 되었습니까?

해결책

그래도 이것이 불가능하다고 생각합니다

물론. Iframe에 문제의 내용을 넣지 않는 한. 그런 다음 스타일의 전체 별도 문서를 다르게 얻습니다.

CSS 규칙이 업로드/편집 한 후 .Events를 CSS 규칙에 접두사하여 동일한 효과를 달성 할 생각입니다. 나는 이것이 상당히 문제가 없어야한다고 생각하지만 아무도 문제를 포기합니까?

자동화 된 방식으로? 선택기의 시작 부분을 결정하려면 CSS 입력을 구문 분석 할 수 있어야합니다.

이것은 당신이 올바르게 생각할 수있는 것만 큼 사소하지 않습니다.

/* This is my grate CSS
.sausage { color: red; } adds a class rule
/*/ .eggs, .bacon { color: red; }
.potato:before { content: "; }
.beans { content: "; }

까다로운 CSS의 예입니다. .eggs, .bacon 그리고 .potato 선택기를 시작하고 원할 것입니다 .events 접두사. .sausage 그리고 .beans 그렇지 않습니다.

다른 팁

그렇지 않은 경우 업로드/편집 한 후 CSS 규칙에 .events를 접두사로하여 동일한 효과를 달성 할 생각입니다. 나는 이것이 상당히 문제가 없어야한다고 생각하지만 아무도 문제를 포기합니까?

그것이 유일한 방법이며 괜찮을 것입니다.

CSS 규칙에 단순히 ".Event"를 포함시키는 것이 유지 보수 관점에서 더 안전합니다. 몇 달 동안 길을 따라 가면서 약간의 타이핑을 저장하기 위해 여기서 한 트릭을 잊어 버렸을 것입니다.

요컨대, 유일한 방법은 각 규칙을 .events.

하지만 추가하는 것과 같은 실수를 쉽게하기 때문에 자동으로 그렇게하는 것을 막을 것입니다. .events 규칙적으로 수동으로 두 배가됩니다. 그리고 당신이 페이지에서 몇 가지 스타일을 공유하고 싶다면 .events.special 그리고 .aboutus.special 그런 다음 다른 곳에 두어야합니다.

일반적으로 섹션 당 하나 대신 하나의 스타일 시트를 사용하는 것이 좋습니다. 따라서 사용자가 후속 페이지로 이동할 때 캐시를 받게됩니다. (초기 다운로드 시간을 줄이기 위해 제작 환경에서이를 확정하고 GZIP 할 수 있습니다.)

셀렉터에 클래스 '.events'를 추가 할 것입니다. 수동 프로세스로서 인간의 오류가 발생할 위험이 있습니다. 여기에 방법이 있습니다 모든 CSS 클래스에 선택기를 추가하는 프로세스를 부분적으로 자동화.

또는 이것을 사용할 수 있습니다 자동 접두사, 그러나 선택기 사이의 공간을 잘 처리하지 못하는 것 같습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top