2024-09-29本文介绍了一个简单的HTML页面，展示了如何使用CSS3的`transform`和`transition`属性创建一个div元素在鼠标悬停时旋转360度的动画效果，重点讲解了`transform-origin`的用法。

https://www.qianduange.cn//article/18726.html 分类：前端知识

2024-09-03探索跨框架迁移的桥梁：将React无缝转化为Vue babel-plugin-transform-react-to-vueTransform React component to Vue component (beta)项目地址:https://gitcode.com/gh_mirrors/ba/babel-plugin-transform-react-to-vue 在前端开发的世界里，技术栈的..._react代码转vue

https://www.qianduange.cn//article/17528.html 分类：前端知识

2024-08-25本文介绍如何使用CSS3D实现旋转魔方效果，详细解释了关键的CSS属性如`transform-style`, `transition`, `animation`，并展示了如何设置背景图片和定位来构建3D立方体。此外，还提供了HTML结构代码示例和动态效果的说明。" 111186668,9300419,理解Web服务：SOAP与REST的区别,"['Web开发', 'API设计', '分布式系统', '数据交换']

https://www.qianduange.cn//article/16921.html 分类：前端知识

2024-08-12转换的原点 - transform-origintransform-origin 属性指定元素转换原点的位置。默认情况下，转换原点在元素的中心。transform-origin：数值 / 百分比 / 关键字（上下左右中间）- 一个值：表示所有轴的位置。- 两个值：表示 X 轴和 Y 轴。- 三个值：表示 X 轴、Y 轴和 Z 轴。

https://www.qianduange.cn//article/15323.html 分类：前端知识

2024-08-10主要还是考验大家对X,Y,Z三个轴的理解，能否在脑海中构思出大致的逻辑。_transform-style: preserve-3d;

https://www.qianduange.cn//article/15126.html 分类：前端知识

2024-07-30本文介绍了CSS变形动画的基本原理，如translate、rotate、skew、scale和matrix等操作，以及transform-origin的使用，帮助读者理解并学习如何为网页添加动态效果，提升用户体验和设计创新。

https://www.qianduange.cn//article/14565.html 分类：前端知识

2024-05-25给echarts再加上 zoom、transform：scale、transform-origin，这三个属性，即：既然body缩放了，那么渲染echarts图表的div再给他放大回去就好了。因为设置了zoom，如果你在你的项目中设置了zoom以达到缩放比例的适配，在使用echarts图表时就会出现错位的问题。当页面body拥有zoom属性之后，鼠标划过echarts图表时，触发位置就不正常。1、在页面存在缩放的时候，echarts鼠标移入焦点错位的问题。_echart错位

https://www.qianduange.cn//article/9412.html 分类：前端知识

2024-04-29一、3D 呈现效果 - transform-style 属性1、transform-style 属性语法二、transform-style 属性示例1、核心要点设置 透视视图 效果设置 父容器 3D 呈现效果结构伪类选择器2、代码示例_transform-style: preserve-3d

https://www.qianduange.cn//article/6374.html 分类：前端知识

2024-04-15transform-origin用于设置动画的基点(中心点) ， 适用于所有块级元素及某些内联元素。 必须配合transform使用 默认情况下，元素的动作参考点为元素盒子的中心 可以设置九个位置的值：水平方向： left center right 0 50% 100% ......_transform-origin

https://www.qianduange.cn//article/5029.html 分类：前端知识

2024-03-18转换Transform我们简单理解就是变形有2D和3D之分我们暂且学了三个 分别是位移 旋转和缩放2D移动translate（x,y)最大的优势是不影响其他盒子，里面参数用%，是相对于自身宽度和高度来计算的可以分开写比如translateX(x)和translateY(y)2D旋转rotate（度数） 可以实现旋转元素 度数的单位是deg2D缩放scale（x,y)里面的参数是数字不跟单位 可以是小数 最大的优势 不影响其他盒子设置旋转中心点transform-origin:x y。

https://www.qianduange.cn//article/3930.html 分类：前端知识