2014-02-15 3 views
0

다른 사람들이 자신의 웹 사이트에 포함시킬 수있는 webapp를 작성 중입니다. 이 webapp의 일부는 자체 스타일 시트가있는 대화 상자를 구성합니다. 예를 들어 내 대화 상자가 클래스 .container에 있고 앱이 포함 된 웹 사이트에 다른 수단으로 .container이 사용되는 경우 문제가 발생할 수 있습니다.웹 응용 프로그램에서 CSS 충돌 방지

내 모든 클래스의 이름을 .appname-container과 같은 것으로 바꾸고 다른 솔루션이없는 경우이를 수행 할 것입니다. 그러나 나는 가능한 한 게으르고 싶습니다. 내가 제어 할 수없는 스타일 시트와의 예기치 않은 충돌을 방지하는 쉬운 방법이 있습니까?

편집 : 내 웹 애플리케이션은 <video> 요소 주위에 자신을 감싸고, 그래서 <iframe>들 사용될 수 있다는 것을 확실하지 않다.

+0

가장 좋은 대답은 질문에 있습니다. 나는 앱명 접두사 기술을 정확하게 따를 것이다. –

답변

1

iframe은 기존 앱과의 모든 충돌을 피할 수있는 유일한 방법입니다. 이름 공간은 CSS가 없어도 프레임이 없어도 스타일을 적용하지 않아도되므로 기존 스타일이 콘텐츠에 영향을 줄 수 있습니다. 콘텐츠가 단순하다면, 당신은 미래의 가능성 참고로 일부 재설정

+0

서버의 iframe에 링크하지 않고 iframe을 즉시 생성하고 대화 상자 데이터를 쓸 수 있습니까? –

+0

고객이 콘텐츠를 시작하는 방법을 모르겠다면 iframe 요소를 생성 할 수 있지만 실제 소스가없는 콘텐츠를 추가하는 것은 불가능할 수 있습니다. 나는'about : blank'가 작동해야한다고 알고 있지만 브라우저가 문서로 취급하는 방법을 모르겠습니다. iframe을 생성하거나 고객에게 iframe 소스를 제공하고 페이지의 마지막에 액세스하도록하는 것이 가장 좋습니다. – helion3

1

멀리 얻을 수 있습니다, 우리는 결국이를 위해 CSS3 all 속성을 사용할 수 있습니다 : 불행하게도

http://www.w3.org/TR/css3-cascade/#all-shorthand

, 그것은 '아무튼 아직 사용할 준비가 된 것 같습니다. (Caniuse에서 아직 언급되지 않았다.)