使javascript图像随机化器响应css？

Question

我是一个前端网页设计师，对 javascript 了解甚少，但我想包含一个基于 javascript 的图像随机化器（每次用户刷新页面时图像都会改变），但唯一的问题是我真的不确定如何通过 CSS 使元素响应。在这一点上，我什至不确定这是否可能，但我已经尝试将脚本包含在 div 中，并给 img 标签一个类并将其添加到 CSS 中，但似乎没有任何效果。

我发现脚本本身效果很好，但我需要能够对其应用样式（尤其是响应式样式！），我真的很难过。

这是脚本本身：

<script type="text/javascript">
        var total_images = 3;
        var random_number = Math.floor((Math.random()*total_images));
        var random_img = new Array();
        random_img[0] = '<a href="page1.html"><img class="center" src="red.png"></a>';
        random_img[1] = '<a href="page2.html"><img class="center" src="blue.png"></a>';
        random_img[2] = '<a href="page3.html"><img class="center" src="placeholderbanner.png"></a>';
        document.write(random_img[random_number]);
        </script>

有没有人对如何做这件事有一些好的建议？我真的很感激我能得到的任何帮助！

Answer 1

只需将以下内容添加到您的 CSS 或将其放入标签中

    .center {
        float: left;
        max-width: 100%;
     }