ბლოკის გრადიენტული ფონი

ჩვენ შეგვიძლია ელემენტებს ფონად დავუყენოთ არა მარტო მონოტონური ფერი, არამედ სხვადასხვა ტიპის გრადიენტი. 
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
}


შემდეგ ბმულზე განხილულია უამრავი მაგალითი გრადიენტის ჩასხმისა.  იხილეთ ბმული

მსგავსი სიახლე