Различия

Показаны различия между двумя версиями страницы.

--- background-size [2023/09/25 18:13]
tro
+++ background-size [2023/09/25 18:15] (текущий)
tro
@@ Строка 12: / Строка 12: @@
 </code>
-  - Значення cover:
+. Значення **cover**:
   * Гарантовано зберігає пропорції зображення.
@@ Строка 19: / Строка 19: @@
-  - Значення contain:
+. Значення **contain**:
   * Гарантовано зберігає пропорції зображення.
   * Зображенню задані максимально можливі розміри, за яких воно повністю поміщається в елемент.
   * Зображення може не закрити весь фон елемента по вертикалі або горизонталі, якщо пропорції блоку та зображення не збігаються.
+<code>
+.hero {
+  background-color: #2a2a2a;
+  background-image: url(шлях до зображення);
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: cover;
+}
+</code>