이미지와이 바이올린에서 볼 수 있듯이 http://jsfiddle.net/W5Yu4/ 나는 HTML 부분에 CSS 스타일과 클래스를 작성했지만 CSS 클래스를 인식하지 못하는 것처럼 제대로 작동하지 않습니다.페이지 CSS가이 경우와 같이 올바르게 작동하지 않는 이유는 무엇입니까?
.model-landing-page .explore-wrapper {
width: 930px;
margin-bottom: 20px;
float: left;
border: solid 5px #96172e;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding-bottom: 10px;
}
내가 뭘 잘못하고 있니?
당신의 스타일 클래스 .model-landing-page 인 요소에 싸여 클래스 .explore-wrapper 인 요소를 찾고 있습니다. 귀하의 HTML에 .model-landing-page이 표시되지 않으면 본 수업을 본인의 몸에 추가하십시오.
해당 CSS는 model-landing-page에 포함 된 explore-wrapper 클래스의 내용에만 적용됩니다. model-landing-page 클래스가있는 HTML에는 아무 것도 표시되지 않습니다. 당신이 중 하나를 클래스에 적용 할 경우
규칙은 다음과 같아야합니다
.model-landing-page, .explore-wrapper {
/* ... */
}
하거나
.explore-wrapper {
/* ... */
}
전혀 외부 클래스에 대해 걱정하지 않는 경우 .
JsFiddle에는 HTML 섹션에 본문이 없으므로 .error-page 및 .model-landing-page 클래스가 HTML에 존재하지 않습니다. 당신은 모든 것이 잘 작동이 클래스 제거하면 : 당신의 HTML은 서로 배후를 넣어
.explore-wrapper
을 표시하면서이
.model-landing-page .explore-wrapper
을 사용하고 있기 때문에 어쩌면 Demo
을들이 중첩되어 있다는 것을 의미한다. 기본적으로 모델 방문 페이지 안에 .explore-wrapper가 있습니다. 여기에는 아무 것도 없습니다.
여기에서 성취하려는 것은 무엇입니까? '# 96172e' 경계라면'.model-landing-page '를 제거하십시오. –