Как нарисовать прямоугольник с дырками внутри?

Question

[Ribachok]

Как средствами css сделать такой дырявый внутри прямоугольник?

Comments

[Сергей Сергей]

"css фон в горошек с прозрачностью".

Answer 1

[Сергей delphinpro]

Answer 2

[andand44]

.dots-background {
    background-image: radial-gradient(#212121 20%, #e53935 20%);
    background-position: 0 0;
    background-size: 10px 10px;
    height: 200px;
    width: 100%;
}

Размер точек регулируется с помощью background-size на глаз.
Пример https://jsfiddle.net/znaum36v/

Answer 3

[Ankhena]

Радиальными градиентами. Один цвет - цвет фона, второй transparent.
Задаете радиус кругов и размер "квадратика".

background: radial-gradient(4px, transparent 100%, #333) repeat center / 20px 20px;

https://jsfiddle.net/0d651jrw/