Html Sayfalarında Satır Atlama Ve Alt Satıra Geçme - Br Etiketi

Html sayfalarımızı tasarlarken en sık kullandığımız etiketlerden olan br etiketi, alt satıra geçmeye yani br etiketinden sonra gelen kodun bir alt satırdan devam etmesini sağlar. Br etiketi ile ilgili bunun dışında çok fazla söylenecek birşey yok aslında. 

Kullanımı şu şekildedir;

<br />
123 <br/>

Örnek üzerinde açıklamak gerekirse;

 ⇒  P etiketi ile şöyle bir paragraf ekliyorum.

<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
123 <p>Lorem Ipsum issimply dummy text of the printing andtypesetting industry.</p>

Tarayıcıdaki Görünümü

br-etiketi-html-satir-atlama

 ⇒  Şimdi yazı içerisine br etiketlerini yerleştirelim.

<p>Lorem Ipsum <br /> is <br /> simply dummy <br /> text of the printing <br /> and typesetting industry.</p>
123 <p>Lorem Ipsum<br/>is<br/>simply dummy<br/>text of the printing<br/>andtypesetting industry.</p>

Tarayıcıdaki Görünümü

html-alt-satir-kodu-br-etiketi

Gördüğünüz gibi br etiketini koyduğumuz her yerde, sonrasında gelen yazılar alt satırdan devam ediyor.

 ⇒  Html sayfalarında yazıları kullanırken biz ne kadar boşluk bırakırsak bırakalım veya enter’a basarak alt satırdan yazmaya devam edelim, tarayıcı bu boşlukları kabul etmeyecektir. Sanki hiç boşluk yokmuş gibi yazılar yan yana görüntülenecektir. 

Örneğin p etiketi ile bir şiir yazdığımızı düşünelim. Şiirin her satırından sonra bir alt satıra geçelim.

Html Kodları

<p> Ne hasta bekler sabahı, Ne taze ölüyü mezar. Ne de şeytan, bir günahı, Seni beklediğim kadar. </p>
12345678 <p>Ne hasta bekler sabahı,Ne tazeölüyümezar.Ne deşeytan,birgünahı,Seni beklediğim kadar.</p>

Bu şiirin tarayıcıdaki görüntüsü 4 satırdan oluşmayacaktır. Hepsi yan yana tek satırda görüntülenecektir.

html-satir-atlama

Bu problemi iki farklı yöntem ile çözebiliriz. 

 ⇒  Birincisi, zaten konumuz olan br etiketi ile çözmek.

<p> Ne hasta bekler sabahı, <br /> Ne taze ölüyü mezar. <br /> Ne de şeytan, bir günahı, <br /> Seni beklediğim kadar. <br /> </p>
12345678 <p>Ne hasta bekler sabahı,<br/>Ne tazeölüyümezar.<br/>Ne deşeytan,birgünahı,<br/>Seni beklediğim kadar.<br/></p>

Kodu bu şekilde yazdığımızda br etiketinden sonra gelen her yazı, bir alt satırdan devam edecektir. 

html-alt-satir-kodu

 ⇒  İkinci yöntem ise pre etiketini kullanmak. Pre etiketi ile yazılan metinlerde kullanılan boşluk ve satır başları tarayıcıda korunarak görüntülenir.

Örneğin şöyle Html kodlarımız olsun.

<pre> a = 5; b = 7; c = a + b; </pre>
1234567 <pre>a=5;b=7;c=a+b;</pre>

Normalde br etiketini kullanmadığımız için kodların yanyana görüntüleneceğini düşünebilirsiniz. Ama pre etiketi içerisindeki metinleri nasıl yazarsanız aynen o şekilde tarayıcıda görüntülenir.

html-alt-satir

Br etiketi yerine alternatif bir yöntem olarak kullanabilirsiniz.

 ⇒  Br etiketinin varsayılan olarak gelen Css değeri yoktur.

 ⇒  Br etiketini tüm tarayıcılar desteklemektedir.

Umarım sizin için faydalı bir yazı olmuştur.

Yeni bir yazımda görüşmek üzere.

Tweet Pin It

Từ khóa » Html Br Kullanımı