CSS圖片外旋轉是一種通過CSS設置圖片的旋轉角度和方向，將圖片旋轉到超出了圖片邊界的效果。這種技巧可以用于許多不同的用途，例如制作動態滾動效果、創建有趣的網格布局等等。

下面是一個使用CSS圖片外旋轉的簡單示例：

```html

<div class="transformer-end">

<div class="transformer-inner">

</div>

</div>

</div>

在“transformer-inner”元素中，我們使用CSS設置了一個旋轉角度和方向，使圖片向外旋轉了45度。我們可以使用“transform”屬性來設置旋轉方式，其中“旋轉軸”和“旋轉角度”參數指定了旋轉的方向和角度。

下面是一個簡單的CSS代碼示例，用于將圖片旋轉45度并向外旋轉45度：

```css

position: relative;

.transformer-end {

position: absolute;

top: 0;

left: 0;

width: 100%;

height: 100%;

transform: rotate(45deg);

transform-origin: 0 100%;

.transformer-inner {

position: absolute;

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

width: 100%;

height: 100%;

在這個示例中，“transformer-inner”元素被設置為絕對定位，并將其寬度和高度設置為100%。我們還使用“transform”屬性將“transformer-end”元素設置為一個45度的旋轉軸，并將其旋轉了45度。

通過使用CSS圖片外旋轉，我們可以輕松地將圖片旋轉到超出了圖片邊界，從而實現有趣的效果。這種技巧可以用于制作各種有趣的應用，例如動態滾動效果、網格布局等等。