HTML连载69-透视属性以及其他属性练习

一、透视属性
1.什么是透视
透视简单来说就是近大远小
2.注意点：一定要注意，透视属性必须添加到需要呈现近大远小效果的元素的父元素。
3.格式：perspective:数字px;
这里的数字代表透视的大小距离。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>D172_PerspectiveExercise</title><style>*{margin:0px;padding:0px;}div{width: 500px;height: 750px;border:1px solid black;margin:100px auto;background-color: skyblue;perspective: 500px;}div img{/*修改形变中心点，否则旋转的中心不对*/transform-origin:center bottom;transition:transform 1s;}div:hover img{transform:rotateX(45deg);}
</style>
</head>
<body>
<div><img src="data:image/play_tennis.jpg" alt="">
</div>
</body>
</html>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1IpVXpHa-1582128798600)(https://www.cnblogs.com/ruigege0000/p/12334018.html)]

三、源码：
D171_PerspectiveAttribute.html
D172_PerspectiveExercise.html
地址:
https://github.com/ruigege66/HTML_learning/blob/master/D171_PerspectiveAttribute.html
https://github.com/ruigege66/HTML_learning/blob/master/D172_PerspectiveExercise.html
2.CSDN：https://blog.csdn.net/weixin_44630050
3.博客园：https://www.cnblogs.com/ruigege0000/
4.欢迎关注微信公众号：傅里叶变换，个人账号，仅用于技术交流，后台回复“礼包”获取Java大数据学习视频礼包

HTML连载69-透视属性以及其他属性练习相关推荐

html5的方框属性,HTML连载37-边框属性（下）、边框练习
HTML连载37-边框属性(下).边框练习一.边框属性 1.连写(分别设置四条边的边框) border-width:上右下左: border-style:上右下左: border-col ...
通过List里面对象的属性值来去重List，并把相同属性的其他属性相加
最近在做一个大的项目,其中有一个通过List里面对象的属性值来去重List,并把相同属性的其他属性相加,都说通过Map的key唯一,来去重.记录一下首先有一个实体类User package com. ...
2D转换模块-透视属性
在2D转换模块中的透视属性,它的本质是近大远小,他总是与旋转属性结合在一起使用. 格式为:perspective:具体像素. 注意点: 透视属性只能放在要进行修改的元素的上一级元素中,放在本级元素中无 ...
HTML连载14-文字属性补充简写
一.字体属性(补充) 1.如果设置的字体不存在,那么系统会使用默认的字体来显示宋体. font-family:"瞎写的一个字体"; 2.如果设置的字体不存在,而我们又不想用默认的字 ...
新睿云亚马逊_等待亚马逊新的可穿戴需求，让我穿着内衣
新睿云亚马逊 Amazon says your semi-nude pictures will be automatically deleted from its servers after 3D ...
“约见”面试官系列之常见面试题第三十七篇之CSS3新属性（建议收藏）
目录 CSS3 结构(位置)伪类选择器(CSS3) 目标伪类选择器(CSS3) 属性选择器(CSS3) 伪元素选择器(CSS3,重要) CSS3盒模型(重要) 颜色模式盒子阴影(CSS3) 文本阴影 ...
前端常用属性知识点--文档
清除浮动带来的影响--.clearfix .clearfix{ *zoom:1; } .clearfix::after{content: "";display: block;cle ...
CSS常用样式属性锦集
以下快捷键针对webstorm,idea也可以用一.文字属性 1.文字样式属性格式:font-style: italic; 取值:normal:正常显示 italic:斜体快捷键: fs fon ...
python中类的约束和限制对象添加属性
通过__slots__限制对象可添加的属性 class A:__slots__ = ['a', 'b']passa1 = A() a1.a = 10 print(a1.a) a1.c = 0 # 只能 ...

HTML连载69-透视属性以及其他属性练习

HTML连载69-透视属性以及其他属性练习相关推荐

最新文章

热门文章