温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

css中的图片翻转属性是哪一个

发布时间:2021-03-03 15:20:17 来源:亿速云 阅读:171 作者:小新 栏目:web开发

小编给大家分享一下css中的图片翻转属性是哪一个,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

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

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视频教程)

具体代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php.cn</title> 
<style> 
div
{
	width:200px;
	height:100px;
	background-color:yellow;
	/* Rotate div */
	transform:rotate(7deg);
	-ms-transform:rotate(7deg); /* IE 9 */
	-webkit-transform:rotate(7deg); /* Safari and Chrome */
}
</style>
</head>
<body>

<div>Hello</div>

</body>
</html>

运行结果:

css中的图片翻转属性是哪一个

以上是“css中的图片翻转属性是哪一个”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css
AI