CSS에서는 border-collapse 속성을 사용하여 테이블에서 반복되는 테두리를 제거할 수 있습니다. 이 속성은 테이블 테두리를 단일 테두리로 축소할지 또는 분리할지 여부를 설정할 수 있습니다. 겹치는 테두리는 단일 선 테두리 효과를 얻기 위한 테두리가 됩니다.
이 튜토리얼의 운영 환경: Windows 7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.
table{ border-spacing: 0; border-collapse: collapse; } table td { border: 1px solid #000; padding: 20px 30px; }
테이블 테이블에서 각 셀의 테두리를 추가하고 여백을 제거하면 양식에서 테두리가 겹쳐서 테두리 선이 두꺼워지는 문제가 발생합니다. , 그런 다음 border-collapse: collapse
를 설정하여 테두리를 설정할 수 있습니다. 그러면 겹치는 테두리를 하나의 테두리로 병합하여 한 줄 테두리 효과를 얻을 수 있습니다.
Rendering:
설명:
border-collapse 속성은 테이블의 테두리를 단일 테두리로 병합할지 아니면 표준 HTML처럼 별도로 표시할지를 설정합니다.
속성 값:
별도 기본값. 국경이 분리됩니다. border-spacing 및 빈 셀 속성은 무시되지 않습니다.
collapse 가능하다면 테두리가 하나의 테두리로 병합됩니다. border-spacing 및 빈 셀 속성은 무시됩니다.
관련 소개:
border는 border 속성의 약어입니다.
CSS 테두리 속성은 요소 테두리의 스타일, 너비 및 색상을 지정하는 데 사용됩니다.
설정할 수 있는 속성은 (순서대로) border-width, border-style 및 border-color입니다.
하나의 값만 설정할 수도 있습니다. 예를 들어 border: #FF0000이 정확하고 다른 값은 해당 속성의 초기 값으로 설정됩니다.
구문 형식
테두리 속성은 아래 나열된 하나, 둘 또는 세 개의 값을 사용하여 지정할 수 있으며 값의 순서는 중요하지 않습니다.
/* 边框样式 */ border: solid; /* 边框宽度 | 边框样式 */ border: 2px dotted; /* 边框样式 | 边框颜色 */ border: outset #f33; /* 边框宽度 | 边框样式 | 边框颜色 */ border: medium dashed green; /* 全局值 */ border: inherit; border: initial; border: unset;
참고: 테두리 스타일이 정의되지 않은 경우에는 그렇지 않습니다. 눈에 띄게. 이는 스타일이 기본적으로 없음으로 설정되어 있기 때문입니다.
관련 추천: "css 비디오 튜토리얼"
위 내용은 CSS에서 테이블의 반복되는 테두리를 제거하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!