Как сделать скругление у input и button?

Для добавления скругления к элементам в HTML, таким как input и button, вы можете использовать CSS свойство border-radius.

Свойство border-radius позволяет добавить скругление углов элемента, создавая более современный и приятный внешний вид. Для его использования вам необходимо добавить стиль к соответствующему селектору.

Пример:

<style>
    .rounded-input {
        border-radius: 10px;
    }

    .rounded-button {
        border-radius: 20px;
    }
</style>

<input type="text" class="rounded-input">
<button class="rounded-button">Нажми меня</button>

В данном примере мы создали два класса - .rounded-input и .rounded-button, каждый из которых имеет свойство border-radius. Значение свойства border-radius указывает радиус скругления в пикселях. В нашем случае, .rounded-input имеет радиус скругления 10px, а .rounded-button - 20px.

Вы также можете использовать проценты или ключевые слова вместо пикселей, чтобы указать относительные значения. Например, вы можете использовать "50%" для создания круглой формы:

<style>
    .rounded-input {
        border-radius: 50%;
    }
</style>

<input type="text" class="rounded-input">

В результате кода выше input примет форму круга.

Применение border-radius свойства позволяет легко добавлять скругление углов к элементам HTML, таким как input и button, и дает больше свободы для создания желаемого дизайна веб-страницы.