简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
집 > 웹 프론트엔드 > HTML 튜토리얼 > 본문

HTML의 테이블 태그 소개(코드 포함)
不言
풀어 주다： 2018-08-02 09:53:12
원래의
3250명이 탐색했습니다.

이 글은 HTML의

태그에 대한 소개입니다. 이는 특정 참조 값을 가지고 있으므로 도움이 될 수 있습니다.

테이블

테이블은

태그로 정의됩니다.

각 테이블에는 여러 행(

태그로 정의됨)이 있으며, 각 행은 여러 셀(를 직접 사용합니다.

위 그림의 코드는 다음과 같습니다

<body>
        <table width="400" height="400" border="2">
            <!-- 第1行 -->
            <tr>
                <td colspan="4" bgcolor="aqua"></td>
            </tr>
            <!-- 第2行 -->
            <tr>
                <td rowspan="4" bgcolor="antiquewhite"></td>
                <td colspan="3" bgcolor="antiquewhite"></td>
            </tr>
            <!-- 第3行 -->
            <tr>
                <td rowspan="3" bgcolor="aquamarine"></td>
                <td colspan="2" bgcolor="aquamarine"></td>
            </tr>
            <!-- 第4行 -->
            <tr>
                <td rowspan="2" bgcolor="bisque"></td>
                <td bgcolor="bisque"></td>
            </tr>
            <!-- 第5行 -->
            <tr>
                <td></td>
            </tr>
        </table>
    </body>
로그인 후 복사

관련 추천 글:

html 라벨 옵션 지정 및 라벨 추가(코드 포함)

탄력적 레이아웃이란 무엇인가요? 유연한 레이아웃 플렉스의 기본 적용(코드 포함)

위 내용은 HTML의 테이블 태그

태그로 정의됨)로 나뉩니다.

td 문자는 테이블 데이터, 즉 데이터 셀의 내용을 나타냅니다.

데이터 셀에는 텍스트, 그림, 목록, 단락, 양식, 수평선, 표 등이 포함될 수 있습니다.

예를 들어 다음 테이블을 그리려면:

분석: 1. 행을 분석합니다. 각 행은 tr 레이블입니다.

　 2. 첫 번째 행부터 시작하여 각 행에 몇 개의 셀이 있는지 확인합니다. 그리드는 td 태그 몇 개에 불과합니다

　　 3. 차지하는 공간이 1행 1열인 경우 행 수를 생략하고

소개(코드 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨：
表格标签<table>
원천：php.cn
이전 기사：html은 라벨 옵션을 제공하고 라벨(코드 포함)을 추가합니다. 다음 기사：Vue에서 계산된 속성의 사용 정보(코드 포함)
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
흰색으로 설정된 HR 태그가 반투명한 이유는 무엇입니까? 나는 HTML(부트스트랩 포함)과 CSS를 가지고 있습니다. 내 HTML에는 클래스가 있는 <hr> 태그가 있고 CSS에는 테두리 스타일이 있습니다. ...
에서 2024-04-06 16:13:26
0
1
500
테이블 대신 DOM을 통해 데이터를 렌더링하는 방법 만들고 있는 애플리케이션에 대해 질문이 있습니다. Oracle 데이터베이스를 사용하고 있으며 데이터베이스에서 정보를 가져와 테이블을 통해 화면에 표시하고 있는데 ...
에서 2024-04-04 18:17:27
0
1
3567
특정 클릭 이벤트를 수신하고 다른 클릭 이벤트는 억제하는 방법은 무엇입니까? 내 웹 애플리케이션에는 각 행이 특정 URL(<table><trdata-url="https://www.google.com">...
에서 2024-04-04 16:55:27
0
1
317
수직으로 회전된 표 제목, 중앙 + 하단 정렬, 브라우저 간 Chrome에서는 예상대로 보이지만 Firefox에서는 그렇지 않은 회전된 헤더가 있는 테이블이 있습니다. Chromev108(수직 하단, 수평 중간) ✅Fire...
에서 2024-04-04 16:45:25
0
1
330
테이블 셀의 컨테이너가 상위 셀의 전체 높이를 채우는지 확인하세요. Flexbox를 사용하지 않고 콘텐츠를 세로로 정렬하려고 하는데, 우리 사용 사례에 문제가 있어서 세로로 정렬된 테이블로 하려고 하는데 문제는 그 안의 콘텐츠가 ...
에서 2024-04-04 16:03:18
0
1
404
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！