20 lines
736 B
HTML
20 lines
736 B
HTML
<head>
|
|
<style>
|
|
div { }
|
|
.radial::before { width:150px; height:150px; border:2px solid black;
|
|
content: -webkit-gradient(radial, 45 45, 10, 52 50, 30, from(#A7D30C), to(rgba(1,159,98,0)), color-stop(90%, #019F62));
|
|
display: block;
|
|
}
|
|
.linear::after { width:130px; height:130px; border:2px solid black;
|
|
content: -webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff), color-stop(0.5, #fff), color-stop(0.5, #66cc00));
|
|
display: block;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Radial Gradient Example</h1>
|
|
<div class="radial">There's some generated content above me.</div>
|
|
<h1>Linear Gradient Example</h1>
|
|
<div class="linear">There's some generated content below me.</div>
|