0
This jsfiddle에는 네 개의 중첩 테이블이있는 테이블이 포함되어 있습니다.스타일이 항상 중첩 테이블에 적용되지는 않습니다.
첫 번째 행에있는 테이블의 테두리가 축소되어 있지 않으므로 중첩 테이블이 부모 테이블의 스타일을 상속받지 않는다고 가정합니다.
td.small table 때문에 두 번째 행의 표 테두리가 접혀 있습니다. 좋은.
동일한 행의 td의 패딩은 0이 아니므로 td.small이어야합니다. 나쁜.
CSS 파일과 맨 안쪽 요소의 끝에 선언 된 스타일이 적용된 스타일이어야한다고 생각했습니다. 두 번째 행에 table이 포함 된 td은 class="small"이며 CSS의 끝에 정의되어 있지만 padding은 적용되지 않습니다.
네 번째 행에는 td에 적용된 스타일 및 명시 적 스타일 속성이 있으며,이 경우 작동합니다.
왜 두 번째 행 테이블이 제로 패딩으로 렌더링되지 않습니까? 마지막으로 제로 패딩으로 렌더링 된 이유는 무엇입니까? td.small 하나의 요소 이름 및 하나의 클래스 이름을 갖는 반면, 그 선택은 두 요소 이름 및 하나의 클래스 이름을 가지기 때문에
난 당신이 여기서 뭘하려는 일에 대해 정말 혼란 스러워요. 'td.small table' 패딩 규칙이 있고'td.small'에 대한 다른 패딩 규칙이 있습니다. 어떤 패딩을 원하십니까? – aquinas
유용성과 관계없이 동작은 약간의 논리를 따라야하며이를 이해하고 싶습니다. – stenci
그게 당신이 물어 보는 거라면 : http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html – aquinas