CSS ile Graident Background

YoRuMSuZ

Biz işimize bakalım...
CSS kullanarak graident background (arkaplan) hazırlayabilirsiniz. Ancak tarayıcılar arasında maalesef kodları okumak için bir standart yok. Aşağıdaki CSS kodlarında her tarayıcı için graident background kodları mevcut... Safari de tek renk çalışıyor.

Küçük bir uygulama yapalım.

Aşağıdaki kodları index.htm adı ile bir klasöre kaydedin.
Kod:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
<title>Graident</title>
</head>
<body>
</body>
</html>

Aynı klasörde style.css adında bir dosya oluşturup içine alttaki kodları ekleyin.
Kod:
body { 
	/* Opera */
	background: #74A3C3;
	/* Mozilla: */
	background: -moz-linear-gradient(top, #74A3C3, #000000);
	/* Chrome, Safari:*/
	background: -webkit-gradient(linear,
		left top, left bottom, from(#74A3C3), to(#000000));
	/* MSIE */
	filter: progid:DXImageTransform.Microsoft.Gradient(
		StartColorStr='#74A3C3', EndColorStr='#000000', GradientType=0);
}
 
Geri
Top