Лінійний градієнт в CSS для браузера Opera
Ця стаття надає інформацію про створення лінійного градієнту в браузері Opera за допомогою CSS.
Синтаксис
background-image: -o-linear-gradient([<угол> | <позиція> ,] <колір> [, <колір>]*);
Значення
- <угол>
- Див. угол.
- <колір>
- Представляє собою значення кольору (див. колір), за яким йде необов'язкова позиція кольору відносно вісі градієнту, вказується в відсотках від 0% до 100% або в будь-яких інших підходящих для CSS одиницях.
- <позиція>
- Для запису позиції використовуються ключові слова top, bottom, left, right, а також їх поєднання. Порядок слів не має значення, можна написати left top або top left.
Приклад
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Градієнт</title>
<style>
.приклад {
background: #e2e2e2;
background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%,#fefefe 100%);
background: -webkit-linear-gradient(top, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
background: -o-linear-gradient(top, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
background: -ms-linear-gradient(top, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
background: linear-gradient(top, #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
padding: 10px;
}
</style>
</head>
<body>
<div class="приклад">Зміст сторінки</div>
</body>
</html>