好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

css中的图片翻转属性是什么

css中的图片翻转属性是transform。transform属性应用于元素的2D或3D转换,我们可以 利用 该属性对元素进行旋转、移动、倾斜等操作,如【transform:rotate(7 deg );】。

本文操作环境:windows10系统、css 3、 ThinkPad t480 电 脑。

css3为我们提供了一个 新属性 transform,利用该属性我们可以对元素进行移动、旋转、倾斜等操作。

属性介绍:

Transform属性应用于元素的2D或3D转换。这个属性允许你将元素旋转,缩放,移动,倾斜等。

语法:

transform: none|transform-functions;

常用属性值:

rotate(angle) 定义 2D 旋转,在参数中规定角度。

rotate3d(x,y,z,angle) 定义 3D 旋转。

rotateX(angle) 定义沿着 X 轴的 3D 旋转。

rotateY(angle) 定义沿着 Y 轴的 3D 旋转。

rotateZ(angle) 定义沿着 Z 轴的 3D 旋转。

(学习视频分享:css视频教程)

具体代码:

<!DOCTY PE  ht ML >
<html>
<head>
< ;m eta charset="utf-8"> 
<t IT le>php.cn</title> 
<style> 
div
{
	width:200px;
	h ei ght:100px;
	background-color:yellow;
	/* Rotate div */
	transform:rotate(7deg);
	-ms -t ransform:rotate(7deg); /* IE 9 */
	- webkit -transform:rotate(7deg); /* Safari and Ch rom e */
}
</style>
</head>
<body>

<div>Hello</div>

</body>
</html>

运行结果:

相关推荐:CSS教程

以上就是css中的图片翻转属性 是什么 的详细内容,更多请关注其它相关 文章 !

总结

以上是 为你收集整理的 css中的图片翻转属性是什么 全部内容,希望文章能够帮你解决 css中的图片翻转属性是什么 所遇到的问题。

如果觉得 网站内容还不错, 推荐好友。

查看更多关于css中的图片翻转属性是什么的详细内容...

  阅读:17次