Как сделать обтекание текста / блоков с необычной формой?

Обтекание текста или блоков с необычной формой в веб-разработке реализуется с помощью CSS свойства shape-outside. Это свойство позволяет указывать форму, по которой текст будет обтекать.

Прежде всего, чтобы использовать shape-outside, нужно создать фигуру, по которой текст будет обтекать. Это можно сделать, например, с помощью свойства clip-path. Свойство clip-path определяет область отсечения для элемента, т.е. какая часть элемента будет видна.

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

.circle {
  float: left;
  width: 200px;
  height: 200px;
  shape-outside: circle(50% at 50% 50%);
  clip-path: circle(50% at 50% 50%);
}

Здесь мы создаем блок с классом circle, который будет иметь круглую форму. Свойство shape-outside указывает круглую форму с центром в середине блока (50% 50%), а свойство clip-path обрезает блок по этой же форме.

Также можно создавать и другие формы: квадраты, треугольники, многоугольники и т.д. Все это позволяет создавать интересный дизайн веб-страниц с необычным обтеканием текста или блоков.

Надеюсь, ответ был полезен для вас! Если у вас остались вопросы - не стесняйтесь задавать.