td가 비어있을 때 테두리를 표시하는 방법_HTML/Xhtml_웹페이지 제작

WBOY
풀어 주다: 2016-05-16 16:43:53
원래의
1150명이 탐색했습니다.

이전에 CSS를 사용하여 테이블 테두리, bordercolordark, bordercolorlight의 테두리 밝고 어두운 효과를 얻는 방법을 요약한 후 네티즌이 왜 비슷한 CSS 스타일을 썼는지 물었지만 테이블의 테두리 효과는 정상적으로만 볼 수 있습니다. Opera에서는, IE에서는 아무것도 없습니다.
Opera 9을 다운로드해서 보니 정말 그랬습니다. 이유는 복잡하지 않습니다. IE(Firefox는 IE와 일치하는 것 같습니다)에서는 td의 내용이 비어 있으면 높이와 너비를 설정하더라도 셀의 테두리 스타일이 표시되지 않습니다. 콘텐츠가 있든 없든 스타일은 항상 렌더링에 사용됩니다. 졸업 직후에 이런 문제가 발생했습니다. 당시 부서장이 저에게 와서 물었습니다. 나중에 나는 그에게 말했습니다. 모든 빈 TD에 추가하십시오. 앞으로 이 문제에 직면할 때마다 나는 이 간단하고 투박하며 효과적인 방법을 사용하여 문제를 해결할 것입니다.
하지만 오늘 저는 많은 연구를 했고 원래 CSS 구문을 사용하면 다음과 같은 기본 동작을 변경할 수 있다는 사실을 Jiarry에게서 배웠습니다.
class="test1": border-collapse:collapse;
.test1{
border:1px solid #999999
border-collapse:collapse; >}
.test1 td{
border-bottom:1px solid #999999;
height:28px;
padding-left:6px;
}
class1 여기에 내용이 있습니다. 🎜 >여기에 콘텐츠가 있습니다
class="test2": border-collapse:collapse; 및empty-cells:show;
.test2{
border:1px solid black
border-collapse; :collapse ;
너비:60%
}
.test2 td{
테두리-하단:1px 단색 검정
패딩-왼쪽:6px; >empty -cells:show;
}
class2 여기에 콘텐츠가 있습니다
여기에 콘텐츠가 있습니다
class="test3": border-collapse:collapse;
.test3{
테두리:1px 솔리드 #999999;
너비:60%
}
.test3 td{
border-bottom:1px 솔리드
높이 : 28px;
padding-left:6px;
}
class3 콘텐츠는 여기에
콘텐츠는 여기에

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!