CSS background-repeat Özelliği

Arkaplan görselinin tekrarlanıp tekrarlanmayacağını, tekrarlanacak ise nasıl tekrarlanacağını belirlemek için kullanılır.

Yapısı (Syntax)background-repeat: repeat | repeat-x | repeat-y | no-repeat | initial | inherit;

Varsayılan Değer	repeat
JavaScript Yapısı	object.style.backgroundRepeat="repeat-x"
Animasyon Özellikleri Uygulanabilir	Hayır (Daha fazla detay)

Değerler

Örnekler

Dikey eksende tekrarlanan görsel örneği;

.box {
	width: 300px;
	height: 300px;
	background-image: url(img/logo.png);
	background-repeat: repeat-x;
}

Hiçbir şekilde kendini tekrar etmeyen görsel örneği;

.box {
	width: 300px;
	height: 300px;
	background-image: url(img/logo.png);
	background-repeat: no-repeat;
}

Görselin boyutunu ayarlayarak kırpma işlemi olmadan mümkün olduğunca kendini tekrar ettirme örneği;

.box {
	width: 300px;
	height: 300px;
	background-image: url(img/logo.png);
	background-size: 40px;
	background-repeat: space;
}

background özelliğinde ki kısa kullanım örneği;

.box {
	width: 300px;
	height: 300px;
	background: url(img/logo.png) no-repeat;
}