<template>
<div class="container">
<!-- css画图形成20坐标点 -->
{{ points }}
<div class="background">
<div
class="points"
v-for="(item, index) in points"
:key="index"
:style="{ left: item.x, top: item.y }"
></div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
points: [],
};
},
created() {
for (let i = 0; i < 20; i++) {
const x = Math.random() * 3000;
const y = Math.random() * 1000;
this.points.push({
x: x + "px",
y: y + "px",
});
}
},
mounted() {},
};
</script>
<style scoped>
.background {
position: relative;
width: 100%;
height: 100%;
background: #c1c1c1;
}
.points {
position: absolute;
width: 10px;
height: 10px;
background: #000;
border-radius: 50%;
}
</style>
css画坐标点
最新推荐文章于 2023-09-28 10:45:58 发布