CSS에서 td 요소의 텍스트가 맨 위에 표시되도록 설정하는 방법

CSS에서는 "vertical-align" 속성을 사용하여 td 요소의 텍스트가 맨 위에 표시되도록 설정할 수 있습니다. 이 속성은 속성 값이 ""인 경우 요소의 수직 정렬을 설정하는 데 사용됩니다. text-top"을 선택하면 텍스트가 위에 표시됩니다. 위와 같이 구문은 "td{vertical-align:text-top;}"입니다.

이 튜토리얼의 운영 환경: Windows 10 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

css에서 td 요소의 텍스트가 맨 위에 표시되도록 설정하는 방법

table 태그를 사용하여 테이블을 만들 때 CSS에서 셀의 텍스트를 위쪽으로 정렬해야 하는 경우가 있습니다. 이를 달성하려면 주로 수직 정렬 속성을 텍스트 상단으로 설정하십시오. 다음 예에서는 테이블의 텍스트가 CSS 스타일 시트의 맨 위에 오도록 설정하는 방법을 설명합니다.

예제는 다음과 같습니다.

1. CSS 스타일 시트에서 테이블의 텍스트가 맨 위에 오도록 설정하는 방법을 설명하기 위해 test.html이라는 새 html 파일을 만듭니다. table 태그를 사용하여 표를 생성하고 border 속성을 통해 표의 테두리 너비를 1px로 설정합니다. tr 태그를 사용하여 table 태그 내에 두 개의 행을 만들고, td 태그를 사용하여 행당 두 개의 셀을 설정합니다.

태그를 작성합니다. 다음으로 태그 내에 CSS 스타일을 작성하겠습니다. CSS를 사용하여 td 태그의 너비와 높이를 70px로 설정하고 text-align 속성을 통해 텍스트가 중앙에 오도록 설정합니다.

2. CSS 태그에서 CSS의 Vertical-align 속성을 사용하고 text-top으로 설정하여 텍스트를 위쪽으로 정렬합니다.

브라우저에서 test.html 파일을 열어서 효과를 확인해 보세요.

요약:

1.test.html 파일을 만듭니다.

2. test.html 파일에서 행 2개와 열 2개로 구성된 테이블을 만듭니다.

3. CSS 스타일에서 테이블의 td 태그에 대해 수직 정렬 속성을 text-top으로 설정합니다.

참고:

CSS에서는 셀 td 레이블의 수직 정렬 속성을 사용하고 이를 적용하려면 텍스트 상단으로 설정해야 합니다.

(학습 영상 공유: css 영상 튜토리얼)

위 내용은 CSS에서 td 요소의 텍스트가 맨 위에 표시되도록 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!