CSS 기본 스타일 테이블에 대한 자세한 소개

이 글은 주로 CSS의 기본 스타일 테이블에 대한 자세한 소개를 제공합니다. 관심 있는 친구들이 참고할 수 있습니다.

a.Css 테이블 속성은 테이블 모양을 크게 개선하는 데 도움이 됩니다.

b. 테이블 테두리

rree

테두리 효과 없이 테이블을 생성할 수 있습니다

이때 테이블에 테두리를 추가할 수 있습니다

<table>
    <tr>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
    </tr>
    <tr>
        <td>小王</td>
        <td>20</td>
        <td>男</td>
    </tr>
    <tr>
        <td>小王</td>
        <td>20</td>
        <td>男</td>
    </tr>
    <tr>
        <td>小王</td>
        <td>20</td>
        <td>男</td>
    </tr>
</table>

그러나 이 작성 방법을 모든 테이블에 적용할 수는 없습니다

그래서 CSS 스타일을 더 나은 방법으로 사용하도록 선택할 수 있습니다

<table border = "1">

이때 가장 좋은 것을 볼 수 있습니다 테이블의 형태 외부 파란색 외부 테두리

는 테이블 내부를 설정할 수 있습니다.

<table id="tb">
#tb{
    border: 1px solid blue;
}

여기에서는 그룹화 선택기가 사용됩니다. 즉, id 선택자와 3개의 요소 선택자가 쉼표로 구분되어 결합됩니다

c. 테두리 축소

위 표에서는 이중 테두리가 표시됩니다

이건 확실히 무리입니다

이중 테두리를 한 줄로 합칠 수 있습니다

#tb,tr,th,td{
    border: 1px solid blue;
}

d. 표 너비와 높이

#tb,tr,th,td{
    border: 1px solid blue;
    border-collapse: collapse;
}

e. 표 텍스트 정렬

#tb{
    width: 400px;
    height: 400px;
    border-collapse: collapse;
}
#tb,tr,th,td{
    border: 1px solid blue;
}

f.테이블 패딩

g.테이블 색상

rree

위 내용은 CSS 기본 스타일 테이블에 대한 자세한 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!