将一个DIV旋转的某一角度即90度/180度/270度及放大等问题

如果想要将一个 div 元素旋转某一角度以及放大，可以使用 CSS3 中的 transform 属性来实现。下面是具体的攻略：

基本设置

首先，需要设置 div 的起始状态，并且设置 transform-origin 属性为 center。transform-origin 属性用于设置变形的起点，这里设置为以 div 的中心点为起点。

div {
  width: 100px;
  height: 100px;
  background-color: red;
  transform-origin: center;
}

旋转

假设需要将 div 旋转90度，可以使用 rotate 函数，并设置旋转的角度为90度。示例代码如下：

div {
  transform: rotate(90deg);
}

同样的，可以将 rotate 函数中的角度值修改为180度或270度，实现不同角度的旋转。

放大

如果想要将 div 放大两倍，可以使用 scale 函数，并设置放大的倍数为2。示例代码如下：

div {
  transform: scale(2);
}

同样的，也可以将 scale 函数中的倍数值修改为其他数字，实现不同的放大效果。

旋转并放大

最后，如果需要将 div 旋转90度并放大两倍，只需要将 rotate 和 scale 函数结合起来即可，示例代码如下：

div {
  transform: rotate(90deg) scale(2);
}

以上就是将一个 div 旋转的某一角度、放大等问题的完整攻略。下面是另外两个示例：

示例1：将 div 旋转180度并缩小至原来的一半

div {
  transform: rotate(180deg) scale(0.5);
}

示例2：将 div 旋转270度并放大三倍

div {
  transform: rotate(270deg) scale(3);
}