时间戳

首页 > 解决方案 > 你如何在css中制作多个圆圈

javascript - 你如何在css中制作多个圆圈

问题描述

当我尝试在 css 中制作多个圆圈然后将它们链接到我的 html 文件时。代码如下所示：

.circle{
height: 50px;
width: 50px;
background-color: red;
}

但是当我尝试制作另一个圆圈（通过使用相同的“圆圈”类）时，它会干扰我的一些 javascript 代码，其中一些是我的变量。所以我想知道，是否有第二个圆形标签做同样的事情。

标签： javascripthtmlcss

解决方案

您有一个 css 类作为示例，类可以在您的 HTML 代码中重用。例如：

<div class="circle">One circle</div>
<div class="circle">Another circle</div>

如果您在 JavaScript 中呈现元素，则只需将该类应用于元素，或者直接在 HTML 中应用，如上所示。

另一方面，要在元素上获得圆角边缘，您可以在 css 类中添加边框半径：

.circle{
height: 50px;
width: 50px;
background-color: red;
border-radius: 50%; 
}

推荐阅读