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

Для создания прямоугольника в CSS можно использовать свойство «border». Например, чтобы создать прямоугольник красного цвета с толщиной рамки 2 пикселя и размерами 200 на 100 пикселей, нужно написать следующий код:

<div class="rectangle"></div>

<style>
  .rectangle {
    width: 200px;
    height: 100px;
    border: 2px solid red;
  }
</style>

В данном случае мы создали div-элемент с классом «rectangle» и определили его ширину, высоту и толщину рамки при помощи CSS свойства «border».

Вы также можете использовать свойства «background-color» и «border-radius» для изменения цвета заливки фигуры и скругления углов прямоугольника, соответственно. например:

<div class="rectangle"></div>

<style>
  .rectangle {
    width: 200px;
    height: 100px;
    border: 2px solid red;
    background-color: yellow;
    border-radius: 10px;
  }
</style>

В данном примере мы добавили желтый цвет заливки, а также скруглили углы прямоугольника с помощью свойства «border-radius».

реклама

Качественный хостинг сайтов

реклама

Получите консультацию нашего маркетолога

Изучит ваш проект, подберет подходящие услуги и тарифы

Получите бесплатный аудит

Наш специалист сделает базовый аудит вашего проекта и предложит персональные предложения.

Закажите услугу Как создать прямоугольник в CSS

Наш специалист свяжется с вами в ближайшее время и уточнит детали