Розмір фону - CSS-хитрощі

background-sizeВластивість в CSS є одним з найбільш корисних - і найскладніший - з властивостей фону. Існує багато варіантів та різних синтаксисів, які можна використовувати для цієї властивості, і всі вони мають різні варіанти використання. Ось основний приклад:

html ( background: url(greatimage.jpg.webp); background-size: 300px 100px; )

Це приклад двозначного синтаксису для розміру фону. Існує чотири різні синтаксиси, які можна використовувати з цією властивістю: синтаксис ключового слова, синтаксис з одним значенням, синтаксис із двома значеннями та синтаксис із кількома фонами.

Ключові слова

На додаток до значення за замовчуванням ( auto), ви можете використовувати два ключові слова background-size: coverтаcontain

Перегляньте розмір фону пера від CSS-Tricks (@ css-tricks) на CodePen.

Пов’язані

• фон-вкладення
• фоновий кліп
• Колір фону
• фонове зображення
• фон-походження
• фонове положення
• фоновий повтор

Більше ресурсів

• CSS3 Специфікація
• MDN

Підтримка браузера

Chrome	Сафарі	Firefox	Опера	IE	Android	iOS
3+	4.1+	3,6+	10+	9+	2.3+	4.0+