HTML Metnini Görüntüden Ayrıştırmak İçin Dikey Çizgi Nasıl Çizilir

HTML, yatay çizgiler için olduğu gibi dikey çizgiler için de temiz bir çözüm sunmuyor;


etiketi yok. İş Web sayfanızı metin ve resim arasında net bir açıklama olacak şekilde ayarlamak istiyorsanız, basit bir kenarlık oluşturmak için CSS'yi kullanabilirsiniz. Kenarlık tüm görüntünün etrafından dolaşabilir veya yalnızca bir tarafta kenarlık görüntüleyebilirsiniz. CSS'yi, görüntüleri kaydırıp sarılmış metinler oluşturmak için de kullanabilirsiniz.

1.

Resminizi metninize yerleştirin ve "stil" niteliği etiketi ekleyin. Örneğin, resminizin HTML kodu şöyle görünebilir:

2.

"Stil" niteliğindeki sınırı tanımlayın. Örneğin, görüntünün tamamına uygulanacak bir kenarlık istiyorsanız, CSS şöyle görünür:

Bu, kestirme kenarlık ayarıdır - ilk değer kenarlığın genişliğini belirler, ikincisi kenarlığın türünü tanımlar ve üçüncü değer rengi belirler. Kenarlıklar katı, noktalı, kesik veya çift olabilir; veya oluk, çıkıntı, iç içe geçme veya öteleme gibi bir 3B kenarlık belirleyebilirsiniz.

Gerçek bir dikey çizgi oluşturmak için kenarlığı yalnızca bir tarafa uygulamak istiyorsanız, "kenarlık" yerine "kenarlık sol" veya "kenarlık sağ" kullanırsınız.

3.

Resminizle metniniz arasında biraz boşluk oluşturmak için dolgu ekleyin. Kenarlığın görüntüden 5 piksel uzakta olmasını istiyorsanız, "padding: 5px;" ekleyin. stil etiketinize. Örneğin "padding-left: 5px;" kullanarak bir taraftaki dolguyu belirleyebilirsiniz. Kenarlık ve metin arasında boşluk oluşturmak istiyorsanız, bir kenar boşluğu kullanın. "Src" etiketi için resim URL’nizi de belirtmeniz gerekir. Hepsini bir araya getirdiğinizde, kodunuz şunun gibi görünebilir:

4.

Sınırın istediğiniz gibi görüntülendiğini onaylamak için HTML’nizi kaydedin ve test edin.

Popüler Mesajlar