Как сделать рамку вокруг текста в css

Чтобы добавить рамку вокруг текста в CSS, можно использовать свойство border. Например, если вы хотите добавить рамку вокруг абзаца, используйте следующий CSS:

p {
  border: 1px solid #ccc; /* устанавливает толщину, стиль и цвет рамки */
  padding: 10px; /* добавляет отступ внутри рамки */
}

Этот код устанавливает рамку с толщиной 1 пиксель с тонкой сплошной линией вокруг каждого абзаца на странице. Цвет рамки установлен как серый (#ccc). Свойство padding определяет размер отступа внутри рамки.

Вы также можете использовать другие значения для свойства border, например, dotted, dashed, double и т.д. Чтобы увеличить толщину рамки, увеличьте значение числа в пикселях.

p {
  border: 3px dashed #f00; /* устанавливает широкую пунктирную рамку красного цвета */
  padding: 20px; 
}

Иногда возникает необходимость обводить только некоторый текст, например, заголовок или фрагмент текста, в этом случае можно обернуть его в тег <span> и добавить рамку вокруг этого тега:

h2 span {
  border: 2px dotted #00f; /* устанавливает пунктирную рамку синего цвета вокруг заголовка */
  padding: 10px;
}

<h2><span>Заголовок с рамкой</span></h2>