CSS下变形玉与动画

CSS下变形与动画是网页设计中常用的技术，可以让网页更加生动有趣。接下来我们将分别介绍其使用方法。

transform: scale(1.5);
transform-origin: center; 

首先是变形，其中常用的属性是transform，它可以将一个元素进行缩放、旋转、平移等一系列操作，比如上面的代码将元素放大了1.5倍。transform-origin是设置变形的基点，这里设置为中心点。

@keyframes move {
  from { left: 0; }
  to { left: 50%; }
}

.box {
  position: relative;
  animation: move 2s infinite;
} 

接着是动画，要使用动画需要定义关键帧，即动画的起始和结束点。这里使用了@keyframes定义一个名为move的动画，从左侧移动到右侧。然后通过animation属性将动画应用到一个类名为box的元素上，并设置为2秒的持续时间，无限循环。

这两种技术的应用可以让网页更加生动有趣。同时需要注意，在使用变形和动画时，要考虑浏览器兼容性，尽量使用现代浏览器支持的css语法。