Чтобы задать размер картинки в CSS, используйте свойства width
и height
. Эти свойства задают ширину и высоту элемента соответственно.
Шаги:
- В HTML-документе вставьте тег
<img>
для отображения вашей картинки. Например:
<img src="images/picture.jpg" alt="Моя картинка">
- В CSS определите соответствующий селектор для вашей картинки. Это может быть класс, ID, или даже тег
<img>
если вы хотите оформить все картинки на вашей странице. Например:
img {
width: 400px;
height: 300px;
}
- Установите значения свойств
width
иheight
в соответствующих единицах измерения (например, пиксели, проценты, em) в зависимости от вашего макета и желаемого размера картинки. - Сохраните изменения в вашем CSS-файле и обновите страницу в браузере. Картинка должна иметь указанный вами размер.
Если вы хотите изменить размер картинки без изменения ее пропорций, вы можете использовать только одно из свойств width
или height
, а другое свойство задать в автоматическом режиме, используя значение auto
. Например:
img {
width: 400px;
height: auto;
}
Здесь мы задаем значение width
в 400 пикселей, а свойство height
задаем в значение auto
, чтобы браузер автоматически подстроил высоту картинки с учетом ее пропорций.