translate는 CSS3의 새로운 CSS 속성입니다. 번역 속성은 요소의 2D 번역 변환을 정의하는 데 사용됩니다. 이 속성은 종종 변환 속성과 함께 사용되어 요소에 2D 또는 3D 변환을 적용할 수 있습니다. 구문은 "transform:translate(x축 방향의 이동 거리, y축 방향의 이동 거리)"입니다.

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

translate는 CSS3 속성입니다.

transform 속성은 요소에 2D 또는 3D 변환을 적용합니다. 이 속성을 사용하면 요소를 회전, 크기 조정, 이동 또는 기울일 수 있습니다.

translate(x,y)는 2D 변환을 정의합니다.

구문은 다음과 같습니다.

transform:translate([, ]);

translate() 함수는 요소를 이동할 수 있습니다.

값:

translate( [, ])는 X축과 Y축에서 요소를 동시에 이동하는 것을 의미하며, . 두 개의 매개변수를 포함합니다. 두 번째 매개변수가 생략되면 두 번째 매개변수는 0이고, 매개변수가 음수이면 반대 방향으로 이동한다는 의미입니다.

translateX( ); 요소를 X축(수평 방향)으로만 이동하는 것을 의미합니다.

translateY( ); 요소를 Y축(세로 방향)으로만 이동하는 것을 의미합니다.

translateZ( ); 요소 자체 또는 요소의 상위 요소에 원근 값이 설정된 경우 Z축에서만 요소를 이동하는 것을 의미합니다.

예제는 다음과 같습니다.

    
  
translate() 方法
 
translate() 方法从元素当前位置对其进行移动：
 
 该 div 元素从其当前位置向右移动 50 个像素，并向下移动 100 个像素。 
  

출력 결과:

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

위 내용은 번역은 CSS3 속성인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!