CSS function url()

Опис

Функція url() в CSS використовується для створення посилань на зовнішні ресурси, такі як зображення, шрифти, аудіо- та відеофайли, або інші сторонні файли, які можуть бути використані в CSS. Ця функція дозволяє вам вказати адресу ресурсу та використовувати його в відповідних CSS властивостях.

Наприклад, щоб встановити фонове зображення для елементу, можна використовувати властивість background-image разом із функцією url():

.element {
  background-image: url("image.jpg");
}

Також функція url() дозволяє підключати зовнішні шрифти, як показано у наступному прикладі:

@font-face {
  font-family: "CustomFont";
  src: url("font.woff2") format("woff2"),
       url("font.woff") format("woff");
}

Цей код використовує функцію url() для вказання шляху до зовнішнього шрифту та його формату. Це дозволяє використовувати власний шрифт на веб-сторінці.

Порада:

Використовуйте відносні або абсолютні URL-адреси, залежно від контексту використання функції url().

Порада:

Використання функції url() забезпечує можливість легко включати зовнішні ресурси у ваші стилі та веб-дизайн, роблячи їх більш динамічними та привабливими.

Синтаксис

url(<url>);
<url>

Адреса ресурсу, яку ви хочете використати. Можна використовувати різні типи URL-адрес, такі як відносні або абсолютні URL-адреси до зображень, шрифтів, аудіо- та відеофайлів, сторонніх CSS-файлів тощо.

Переглядачі

Переглядач

1

1

1

3.5

12

Переглядач

4.4

18

4

1


Мобільних переглядачів ще не додано.

Приклади


Наведіть курсор на зображення, щоб змінити значення функції url().

Встановлення фонового зображення елемента за допомогою функції url().