Geçişli Renk (Gradient)
Örnek 1
<!DOCTYPE html>
<html>
<head>
<style>
.bir{
float: left;
width: 40vw;
height: 50vh;
background: linear-gradient(to right bottom, #6e0202, #8a0033, #950c69, #863ba2, #4562d4);
}
.iki{
float: left;
width: 40vw;
height: 50vh;
background: linear-gradient(to left bottom, #6e0202, #8a0033, #950c69, #863ba2, #4562d4);
}
.uc{
float: left;
width: 40vw;
height: 50vh;
background: linear-gradient(to right top, #6e0202, #8a0033, #950c69, #863ba2, #4562d4);
}
.dort{
float: left;
width: 40vw;
height: 50vh;
background: linear-gradient(to left top, #6e0202, #8a0033, #950c69, #863ba2, #4562d4);
}
</style>
</style>
</head>
<body>
<div class="bir"></div>
<div class="iki"></div>
<div class="uc"></div>
<div class="dort"></div>
</body>
</html>
<html>
<head>
<style>
.bir{
float: left;
width: 40vw;
height: 50vh;
background: linear-gradient(to right bottom, #6e0202, #8a0033, #950c69, #863ba2, #4562d4);
}
.iki{
float: left;
width: 40vw;
height: 50vh;
background: linear-gradient(to left bottom, #6e0202, #8a0033, #950c69, #863ba2, #4562d4);
}
.uc{
float: left;
width: 40vw;
height: 50vh;
background: linear-gradient(to right top, #6e0202, #8a0033, #950c69, #863ba2, #4562d4);
}
.dort{
float: left;
width: 40vw;
height: 50vh;
background: linear-gradient(to left top, #6e0202, #8a0033, #950c69, #863ba2, #4562d4);
}
</style>
</style>
</head>
<body>
<div class="bir"></div>
<div class="iki"></div>
<div class="uc"></div>
<div class="dort"></div>
</body>
</html>
Yorumunuzu Ekleyin
