CSS3 전환 속성
예
div 요소 위에 마우스를 올려, 점차적으로 100 픽셀에서 300 픽셀로 테이블의 너비를 변경 ::
사업부
{
폭 : 100 픽셀;
전환 : 폭 2 초;
-webkit-전환 : 폭 2 초 / * 사파리 * /
}
사업부 : 가져가 {폭 : 300 픽셀;}
{
폭 : 100 픽셀;
전환 : 폭 2 초;
-webkit-전환 : 폭 2 초 / * 사파리 * /
}
사업부 : 가져가 {폭 : 300 픽셀;}
»시도
브라우저 지원
표의 수치 속성의 버전 번호를 먼저 지원 브라우저를 나타낸다.
즉시 디지털 -webkit- 이어 -ms- 또는 접두어 지원 전 -moz- 우선 브라우저 버전 번호 때문이다.
| 属性 | |||||
|---|---|---|---|---|---|
| transition | 26.0 4.0 -webkit- |
10.0 | 16.0 4.0 -moz- |
6.1 3.1 -webkit- |
12.1 10.5 -o- |
정의 및 지침을 속성
전이 특성, 전이 기간, 전환 타이밍 기능, 및 전환 지연 : 전환 속성은 약식 속성이 네 가지 속성을 가지고있다.
참고 : 항상 0, 그렇지 않으면 시간을 전이 시간의 속성을 지정, 전환 효과가 없습니다.
| 기본값 : | 모든 0 용이성 0 |
|---|---|
| 상속 : | 아니 |
| 버전 : | CSS3 |
| 자바 스크립트 구문 : | 개체 .style.transition는 = "폭 2 초" |
문법
전환 : 등록 기간 타이밍 기능 지연;
| 值 | 描述 |
|---|---|
| transition-property | 指定CSS属性的name，transition效果 |
| transition-duration | transition效果需要指定多少秒或毫秒才能完成 |
| transition-timing-function | 指定transition效果的转速曲线 |
| transition-delay | 定义transition效果开始的时候 |
