CSS GRADIENTS
<html>
<head>
<style>
#grad1{
height: 200px;
background:linear-gradient(red,yellow);
}
<style>
<head>
<body>
<div id="grad1"> <div>
<body>
<html>
Hasil dari Sintaks di atas:
Note: Internet Explorer 9 and earlier versions do not support gradients.
Linear Gradient ini dimulai dari atas,dimulai dengan warna merah,dan kebawah bertransisi ke warna kuning
<html>
<head>
<style>
#grad1{
height:200px;
background:linear-gradient(to right,red,yellow)
}
<style>
<head>
<body>
<div id="grad1">
<body>
<html>
Hasil dari Sintaks di atas:
Note: Internet Explorer 9 and earlier versions do not support gradients.
Linear gradient ini dimulai dari kiri dengan warna merah,ke kanan bertransisi ke warna Kuning
Linear Gradient – Diagonal
<html>
<head>
<style>
#grad1{
height:200px;
background:linear-gradient(to bottom right,red,blue);
}
<style>
<head>
<body>
<div id="grad1"> <div>
<body>
<html>
Hasil dari Sintaks di atas:
Note: Internet Explorer 9 and earlier versions do not support gradients.
Linear gradient ini dimulai dari kiri atas,dimulai dengan warna merah,bertransisi ke kanan bawah dengan warna biru
<html>
<head>
<style>
#grad1{
height:200px;
background:linear-gradient(to top left,blue,white)
}
<style>
<head>
<body>
<div id="grad1"><div>
<body>
<html>
Hasil dari Sintaks di atas:




Tidak ada komentar:
Posting Komentar