Вирівнювання зображень у тегах <div> Налаштування полів і відступів працюватиме лише на екрані певного розміру. Якщо ви хочете відцентрувати його лише горизонтально, ви можете додати вирівнювання тексту: по центру до div. Якщо ви хочете відцентрувати його вертикально та горизонтально, ви можете використати абсолютне позиціонування або зробити div flexbox: 1.4 березня 2023 р.
Для однорядкового тексту або зображень можна використовувати такі властивості CSS:
- Установіть для батьківського контейнера вирівнювання тексту: по центру. Це центрує дочірній елемент горизонтально всередині батьківського контейнера.
- Використовуйте line-height: <height>, щоб відцентрувати дочірній елемент вертикально всередині батьківського контейнера.
Якщо ви хочете розмістити зображення та текст в одному рядку на сторінці HTML, ви можете це зробити використовуйте тег <p> з атрибутом style, встановленим як display:inline-block . Це відобразить зображення та текст в одному рядку. Для подальшого читання перегляньте цей посібник про те, як вирівнювати зображення поруч.
Ось як:
- Надайте div CSS-клас, як центр.
- У своєму коді CSS введіть селектор .centerCSS і розкрийте дужки стилю.
- Установіть позицію вашого div як абсолютну, щоб вона була зайнята.
Тег <img> є вбудованим тегом. ми можемо оберніть тег img у тег блокового типу, наприклад, тег div, і встановіть властивість text-align як центр. Ми можемо перетворити вбудований тег img на тег block, змінивши властивість display на block.
Щоб відцентрувати текст у CSS, скористайтеся властивістю вирівнювання тексту та визначте її за допомогою значення "center". Ви можете використовувати цю техніку всередині блокових елементів, таких як div. Ви також можете відцентрувати текст у HTML, що корисно, якщо ви хочете відцентрувати лише окремі елементи на сторінці в кожному окремому випадку.