HTML 테이블 셀 내에서 텍스트를 세로로 회전하는 것은 밀집된 테이블의 공간을 최적화하기 위한 일반적인 쿼리입니다. 이 효과를 얻기 위해 널리 사용되는 접근 방식은 변환 속성을 활용하여 CSS 스타일을 정의하는 것입니다.
한 가지 방법은 CSS 회전 속성을 사용하는 것입니다.
.box_rotate { -moz-transform: rotate(7.5deg); /* FF3.5+ */ -o-transform: rotate(7.5deg); /* Opera 10.5 */ -webkit-transform: rotate(7.5deg); /* Saf3.1+, Chrome */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083); /* IE6,IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */ }
이 스타일을 테이블에 적용 셀 안의 텍스트가 시계 반대 방향으로 7.5도 회전합니다.
<code class="html"><td> <div class="box_rotate"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </div> </td></code>
이 기술을 사용하면 텍스트를 수직으로 변환하여 광범위한 제목이나 텍스트가 있는 테이블의 공간을 효과적으로 절약할 수 있습니다.
위 내용은 HTML 테이블에서 텍스트를 수직으로 회전하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!