ايران ويج

نسخه‌ی کامل: گرادیان
شما در حال مشاهده‌ی نسخه‌ی متنی این صفحه می‌باشید. مشاهده‌ی نسخه‌ی کامل با قالب بندی مناسب.
سلام

به کمک این کد در css میتونیم رنگ بندی را به صورت گرادیان داشته باشیم

[attachment=11268]


کد:
<!DOCTYPE html>
<html>
<head>
<style>
#grad1
{
height:200px;
background: -webkit-linear-gradient( #f0e2bd,#FFFFFF); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient( #f0e2bd,#FFFFFF); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient( #f0e2bd,#FFFFFF ); /* For Firefox 3.6 to 15 */
background: linear-gradient( #f0e2bd,#FFFFFF); /* Standard syntax (must be last) */
}
</style>
</head>
<body>



<div id="grad1"></div>



</body>
</html>
سلام
دستت درد نکنه .
موضوع خوبیه
این هم یه سایت که آنلاین باهاش گرادیانت رو طراحی میکنی و کدشو تحویلی می گیری :

Ultimate CSS Gradient Generator
[تصویر:  attachment.php?aid=11312]
کد:
<!DOCTYPE html>
<html>
<head>
<style>
#grad1
{
height:200px;
background: -webkit-linear-gradient(red, blue); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(red, blue); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(red, blue); /* For Firefox 3.6 to 15 */
background: linear-gradient(red, blue); /* Standard syntax (must be last) */
}
</style>
</head>
<body>


<div id="grad1"></div>



</body>
</html>
[attachment=11313]
کد:
<!DOCTYPE html>
<html>
<head>
<style>
#grad1
{
height:200px;
background: -webkit-linear-gradient(left, red , blue); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(right, red, blue); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(right, red, blue); /* For Firefox 3.6 to 15 */
background: linear-gradient(to right, red , blue); /* Standard syntax (must be last) */
}
</style>
</head>
<body>


<div id="grad1"></div>


</body>
</html>