반응형
CSS를 사용하여 테이블의 두 번째 열만 변경하는 방법
css 만 사용하면 테이블의 두 번째 열만 CSS를 재정의하는 방법은 무엇입니까?
다음을 사용하여 모든 열에 도달 할 수 있습니다.
.countTable table table td
내 사이트가 아니기 때문에이 페이지의 html로 이동하여 수정할 수 없습니다.
감사.
다음 :nth-child
과 같이 의사 클래스를 사용할 수 있습니다 .
.countTable table table td:nth-child(2)
그러나 이전 브라우저 (또는 IE)에서는 작동하지 않으므로 셀에 클래스를 제공 하거나이 경우 자바 스크립트를 사용해야합니다.
이 시도:
.countTable table tr td:first-child + td
다른 열의 스타일을 지정하기 위해 반복 할 수도 있습니다.
.countTable table tr td:first-child + td + td {...} /* third column */
.countTable table tr td:first-child + td + td + td {...} /* fourth column */
.countTable table tr td:first-child + td + td + td +td {...} /* fifth column */
테이블의 두 번째 열만 변경하려면 다음을 사용하십시오.
일반적인 경우 :
table td + td{ /* this will go to the 2nd column of a table directly */
background:red
}
너의 경우:
.countTable table table td + td{
background: red
}
참고 : 이것은 모든 브라우저 (현대 브라우저 및 이전 브라우저)에서 작동하므로 이전 질문에 대한 답변을 추가했습니다.
두 번째 열에서 각 셀의 클래스를 지정할 수 있습니다.
<table>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
</table>
이 웹 http://quirksmode.org/css/css2/columns.html 에서 그 쉬운 방법을 찾았습니다.
<table>
<col style="background-color: #6374AB; color: #ffffff" />
<col span="2" style="background-color: #07B133; color: #ffffff;" />
<tr>..
참고 URL : https://stackoverflow.com/questions/2535112/using-css-how-to-change-only-the-2nd-column-of-a-table
반응형
'Programming' 카테고리의 다른 글
파이썬에서 매우 많은 수의 처리 (0) | 2020.07.19 |
---|---|
파이썬 dict.update ()가 객체를 반환하지 않는 이유는 무엇입니까? (0) | 2020.07.19 |
TFS 2010에서 Visual Studio 외부의 파일에 대한 변경 사항을 감지하도록하는 방법은 무엇입니까? (0) | 2020.07.19 |
txt 파일에 줄 바꿈을 추가하는 방법 (0) | 2020.07.19 |
C에서 밀리 초로 대체 슬립 기능이 있습니까? (0) | 2020.07.19 |