HTML'de bir resmin mozaiği nasıl oluşturulur?

Bir web sayfasındaki mozaik bir görüntü.

1. Adım

HTML dosyasını düz metin düzenleyicide açın. "" Etiketli HTML bölümüne gidin. Bu, arka plan resminin yerleştirileceği yerdir.

2. Adım

Bir arka plan resmi ayarlamak için kodu oluşturun. Bu, web sunucunuzun sabit diskindeki "Görüntüler" klasöründe bulunmalıdır. Aşağıdaki kod, web sitesinde arka plan resmi "theImage.jpg" ayarlayacaktır:

vücut {background: beyaz url (/images/theImage.jpg); }

3. adım

Mosaicked görüntüyü yatay olarak yerleştirin. Aşağıdaki kod, resmin sayfa boyunca yatay olarak tekrarlanmasına neden olur:

vücut {background: beyaz url (/images/theImage.jpg) tekrar-x; }

4. Adım

Resmi yatay ve dikey olarak tekrarlayın. Bu, kullanıcının tarayıcısındaki tüm arka plan bölümünü kapsayacaktır. Aşağıdaki kod resminizin mozaiğini oluşturacaktır: body {background: white url (/images/theImage.jpg) repeat-x repeat-y; }