可以使用 CSS 的伪元素 ::before 或 ::after 以及 content 属性来实现点状图案。具体方法如下：
首先，在 HTML 中创建一个元素，例如 div 或 span。
在 CSS 中，为该元素设置宽高、背景色等样式。
利用伪元素 ::before 或 ::after 以及 content 属性，在该元素内部添加一个点状图案。
代码示例：
/* 创建一个宽高为 100px 的 div 元素 */
div {
width: 100px;
height: 100px;
background-color: #ccc;
}
/* 在该 div 元素上创建一个点状图案 */
div::before {
content: "";
display: block;
width: 10px;
height: 10px;
border-radius: 50%;
background-color: #000;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}关键词说明：
伪元素 ::before 或 ::after：在元素的内容前面或后面插入一个伪元素。可以使用 content 属性为伪元素添加内容。
content 属性：用于在伪元素中插入内容。
display 属性：指定伪元素的显示方式，例如 block、inline 等。
width 和 height 属性：指定伪元素的宽度和高度。
border-radius 属性：指定伪元素的圆角半径，用于将方形元素变成圆形。
background-color 属性：指定伪元素的背景色。
position 属性：指定伪元素的定位方式，例如 absolute、relative 等。
top 和 left 属性：指定伪元素的上下左右位置。
transform 属性：指定伪元素的变换方式，例如 translate、rotate 等。在本例中，使用 translate(-50%, -50%) 将伪元素的中心点移到父元素的中心。