CSS - 중첩 된 DIV : Clear Sub Styles

CSS의 특성으로 인해 이것이 가능하고 계단식 연결이 가능할 지 확신하지만 어쨌든 시도 할 것입니다.CSS - 중첩 된 DIV : Clear Sub Styles

사용자가 선택할 주요 요소가 포함 된 이용 약관 상자를 만들었습니다. T & C에는 양식 구성 요소 (라디오 버튼, 확인란)가 있습니다. IFrame에 삽입하고 사용자 입력을 그렇게하는 데 어려움을 겪고 싶지는 않습니다.

오버플로 : 자동 속성이 추가 된 것으로 생각 했으므로 T & C로 스크롤 상자를 만들고 사용자가 옵션을 그런 식으로 선택하게 할 수 있습니다.

글쎄, T & C의 사이트 CSS에 의해 직접적인 영향을받을 수있는 마크가 있기 때문에 사이트의 기본 CSS를 사용하지 않는 방법을 찾아야합니다. 여기

내가 노력하고있는 방식과 유사 할 것 몇 가지 예제 코드입니다 :

<html> 
<head> 
    <style> 
     div 
     { 
      border: solid 1px #000; 
     } 
     div small 
     { 
      font-size: 17pt; 
     } 
    </style> 
</head> 
<body> 
    <div style="overflow: auto; width: 500px; height: 300px;"> 
     <small>This is small text</small> 
     <div> 
      <small>This is small text</small> 
      Lorem ipsum dolor sit amet, consectetur adipiscing 
      elit. Donec vulputate mi sed nisl blandit sed porttitor massa fringilla. 
     </div> 
    </div> 
</body> 
</html>

이의 결과는 텍스트와 예쁜 블랙 박스 다음 더 많은 텍스트와 가진 서브 박스 여기서 핵심 항목은 <small/>에 싸여있는 텍스트입니다.

CSS를 상속받지 않는 특정 div 아래에 아무 것도 가져갈 방법이 있습니까? 어쩌면 나는 완전히 다른 접근법을 취할 필요가있다.

생각 했습니까? 아이디어? 제안?

미리 감사드립니다.

출처

2009-05-12 CodeLikeBeaker

태그 이름을 직접 사용하는 대신 두 세트의 클래스 ("내부"및 "외부")를 유지하고 해당 태그를 사용하십시오.

따라서 div.inner 정의와 div.outer 정의를 가질 수 있으며 별도로 작업 할 수 있습니다. inner은 명시 적으로 설정을 취소해야 할 것입니다 outer하지만,.

뭔가,

<div class="outer"> 
    <div class="outer">Some content. <small>Small text.</small></div> 
    <div class="inner container"> 
    <small>Blah blah blah</small> 
    More content 
    </div> 
</div>

그리고 당신의 CSS 당신이 필요로하는 어떤 정의에

같은

div.outer { 
    border: 1px solid black; 
} 
div.outer small { 
    font: 17pt; 
} 
div.inner { 
    border: none; 
} 
div.inner small { 
    font: 15pt; 
} 
div.container { 
    overflow: auto; 
    width: 500px; 
    height: 300px; 
}

출처

2009-05-12 16:37:55 Welbog

좋아, 이것이 내가 두려워하는 것입니다. 따라서 내 하위 콘텐츠에 CSS에서 직접 변경 될 수있는 다양한 태그가있는 경우 위의 모든 태그를 변경하기 위해 CSS 클래스를 만들어야합니다 ... 슬프지만 슬픔을 향한 첫 번째 단계는 부정. – CodeLikeBeaker

CSS를 상속 할 수있는 방법이라고 생각하지 않습니다. 유일한 방법은 부모에게 명시 적으로 설정된 모든 스타일을 '재설정'하는 것입니다. 기본 속성 목록은 예 : http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/을 참조하십시오.

출처

2009-05-12 16:42:41 second

두 번째 메모로 본질적으로 스타일의 계단식을 방지 할 방법이 없습니다. 결국 CSS를 정의하는 계단식입니다. 따라서 Welbog가 제안한 .inner 및 .outer 접근 방법으로 축소되었습니다.

평소처럼 주 문서의 스타일을 정의하는 것이 줄어들게됩니다. 그러나 T & C div 아래의 동일한 요소에 대해 이러한 스타일을 재정의하려면/re-style을 명시 적으로 무시해야합니다.명시 적으로 예를 들어, 바깥 쪽 DIV의 ID로 모든 선언을 서문을 위해 t_and_c.css에, 당신은 선명도를 유지하기 위해 두 개의 스타일 시트를 사용할 수 있지만 당신은 기억해야 할 것 :

#t&c p {...} 

#t&c a:link, 
#t&c a:visited {...}

출처

2009-05-12 17:37:00

CSS - 중첩 된 DIV : Clear Sub Styles

답변

관련 문제