当前第2页 返回上一页
css perspective属性 示例
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
#div1
{
position: relative;
height: 150px;
width: 150px;
margin: 50px;
padding:10px;
border: 1px solid black;
perspective:150;
-webkit-perspective:150; /* Safari and Chrome */
}
#div2
{
padding:50px;
position: absolute;
border: 1px solid black;
background-color: red;
transform: rotateX(45deg);
-webkit-transform: rotateX(45deg); /* Safari and Chrome */
}
</style>
</head>
<body>
<div id="div1">
<div id="div2">HELLO</div>
</div>
</body>
</html>
|
效果图：
以上就是css perspective属性怎么用的详细内容，更多文章请关注木庄网络博客！
返回前面的内容
相关阅读 >>
2021css常用代码大全
关于css中的id选择器与class选择器的介绍
css 怎么可以不继承样式
css如何实现背景透明，文字不透明？
深入了解css中的will-change属性
css的表格边框使用什么属性设置
浅析html table表格的使用方法
css中device-width与width有什么区别
css如何让div居中？css实现div居中的方法
css target怎么用
更多相关阅读请进入《css》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
转载请注明出处：木庄网络博客 » css perspective属性怎么用
