请用css写一个扫码的加载动画图

创建一个简单的扫码加载动画可以使用CSS的关键帧动画。以下是一个简单的例子，模拟了一个线条从左到右的扫描效果：

1. HTML:

<div class="scanner">
    <div class="scan-line"></div>
</div>

2. CSS:

.scanner {
    width: 200px;
    height: 100px;
    border: 1px solid #000;
    position: relative;
    overflow: hidden;
    margin: 50px;
}

.scan-line {
    width: 100%;
    height: 2px;
    background: #f00;
    position: absolute;
    top: 50%;
    left: -100%;
    animation: scan 2s linear infinite;
}

@keyframes scan {
    0% {
        left: -100%;
    }
    100% {
        left: 100%;
    }
}

这个例子中，.scanner 是一个代表扫码框的容器，而 .scan-line 是代表扫描线的元素。我们使用了一个从左到右的无限循环动画来模拟扫描效果。

你可以根据需要调整动画的速度、颜色、大小等属性。