Thuộc tính transform với giá trị matrix3d (n1,n2,n3,n4,n5,n6n7,n8,n9,n10,n11,n12,n13,n14,n15,16): Định nghĩa một biến đổi 3D, bằng cách sử dụng một ma trận với 16 giá trị.

Danh ngôn cuộc sống:

• Bài viết được đăng bởi: Mr. Phan Nhan
• Ngày cập nhật bài viết: 14/05/2016
• Tổng lược xem trang: 139 / 1 khách
• Đánh giá bởi người dùng:

Thuộc tính transform với giá trị matrix3d (n1, n2, n3, n4, n5, n6, n7 ,n8 ,n9 ,n10 ,n11 ,n12 ,n13 ,n14 ,n15 ,n16): Định nghĩa một biến đổi 3D, bằng cách sử dụng một ma trận với 16 giá trị. CSS viết:

p {
background: #cc0000;
height: 50px;
margin: 0 auto;
width: 120px;
transform: matrix3d(1,0,0,-0.008,0,1,0,0,0,0,1,0,0,0,0,1);
-moz-transform: matrix3d(1,0,0,-0.008,0,1,0,0,0,0,1,0,0,0,0,1);
-webkit-transform: matrix3d(1,0,0,-0.008,0,1,0,0,0,0,1,0,0,0,0,1);
-o-transform: matrix3d(1,0,0,-0.008,0,1,0,0,0,0,1,0,0,0,0,1);
-ms-transform: matrix3d(1,0,0,-0.008,0,1,0,0,0,0,1,0,0,0,0,1);
}

HTML viết:

Giá trị matrix3d (n1). CSS viết:

transform: matrix3d(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(-1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n2). CSS viết:

transform: matrix3d(1, -1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, -1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, -1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, -1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, -1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n3). CSS viết:

transform: matrix3d(1, 0, -1, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, -1, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, -1, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, -1, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, -1, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n4). CSS viết:

transform: matrix3d(1, 0, 0, -0.008, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, -0.008, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, -0.008, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, -0.008, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, -0.008, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n5). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0.5, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0.5, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0.5, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0.5, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0.5, 0, 0, 0, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n6). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n7). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n8). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0.005, 0, 0, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0.005, 0, 0, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0.005, 0, 0, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0.005, 0, 0, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0.005, 0, 0, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n9). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 1, 0, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 1, 0, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 1, 0, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 1, 0, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 1, 0, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n10). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, -1, 1, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, -1, 1, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, -1, 1, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, -1, 1, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, -1, 1, 0, 0, 0, 0, 1);

Giá trị matrix3d (n11). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, -4, 0, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, -4, 0, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, -4, 0, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, -4, 0, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, -4, 0, 0, 0, 0, 1);

Giá trị matrix3d (n12). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0.2, 0, 0, 0, 1);

Giá trị matrix3d (n13). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -40, 0, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -40, 0, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -40, 0, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -40, 0, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, -40, 0, 0, 1);

Giá trị matrix3d (n14). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 40, 0, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 40, 0, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 40, 0, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 40, 0, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 40, 0, 1);

Giá trị matrix3d (n15). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 2, 1);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 2, 1);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 2, 1);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 2, 1);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 2, 1);

Giá trị matrix3d (n16). CSS viết:

transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2);
-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2);
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2);
-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2);
-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2);

Những bài viết được đăng mới nhất.

» Công cụ xóa dấu Tiếng việt