ბლოკის გრადიენტული ფონი
ჩვენ შეგვიძლია ელემენტებს ფონად დავუყენოთ არა მარტო მონოტონური ფერი, არამედ სხვადასხვა ტიპის გრადიენტი.
HTML კოდი:
HTML კოდი:
<!DOCTYPE HTML>
<html>
<header>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>გრადიენტული ფონი</title>
<link href="style.css" type="text/css" rel="stylesheet" />
</header>
<body>
<br><br>
<div class="butt"></div>
<br>
<div class="bloki">
</div>
<br><br>
<br><br>
</body>
</html>
CSS კოდი:
*{
padding: 0;
margin: 0;
}
body{
background-color: #F0EAD6;
font-size: 26px;
color: #F0EAD6;
}
.bloki{
width: 600px;
height: 900px;
margin:0px auto;
background-image: linear-gradient(180deg, #4089DB, red);
}
.butt{
margin:0px auto;
width: 100px;
height: 100px;
border: 1px solid #fff;
border-radius: 50%;
background-image: radial-gradient(red, yellow);
}
.butt:hover{
background-image: radial-gradient( yellow, red);A
}
შემდეგ ბმულზე განხილულია უამრავი მაგალითი გრადიენტის ჩასხმისა. იხილეთ ბმული