Sayfaya yazı yazma

 

<html>
<head> <title>Yazı yazma </title> </head>
<body>
 Bu kısma istediğiniz gibi yazı yazın. Sonra bu yazıların ekranda nasıl görüneceğini hep beraber göreceğiz. Satır sonlarında bir alt satıra otomatikman geçiş yapılacaktır. Hiç merak etmeyin. Deneyin ve görün. Yazı yazmaktan sakın korkmayın.
</body>
</html>

 

Bir web sayfasına yazı yazmak kolaydır. <body> </body> tagları arasına yazacağınız yazılar sayfada gösterilecektir. Hiç bir tag kullanmazsanız satır bittiğinde otomatikman bir alt satıra geçerek yazılar gösterilir. Şimdi bunu deneyelim. Not defterini açın. Kodları aynen yazın ve deneme2.html olarak web sayfam klasörüne kayıt edin. Şimdi web sayfam klasöründen deneme2.html dosyasını çalıştırın.

Bu şekilde birkaç deneme daha yapmanızda fayda var. Biraz deneme yapın ve nasıl olduğuna aşina olun. Eğer dikkat ettiyseniz birden fazla boşluk bıraktığınızda browser bunu görmeyecek ve tek bir boşluk olarak kabul edecektir. Ne kadar tab ve boşluk peş peşe kullanırsanız kullanın bu bir boşluk anlamına gelecektir. Denemelerinizde buna da bakın ve tam olarak kavrayın.

Browsere istediğimiz zaman satır sonu yapmasını nasıl anlatacağız. Evet biz tasarım yapıyor isek istediğimiz an satır sonu yapmak isteriz. Bunun için <p> tagını kullanacağız. <p> tagının bitiş imini kullanmak gerekmemektedir. Browser <p> tagını gördüğü an yeni bir paragraf başlatacaktır. Yani bir satırdan yeni bir paragrafa devam eden yazıları yazacaktır. Şimdide bunu bir deneyelim.

 

<html>
<head> <title>Paragraf oluşturma </title> </head>
<body>
 Şimdi bu yazıları okuyorsunuz. Şu anda bir alt paragrafa geçecek<p> Yeni bir paragrafı okuyorsunuz.<p> Bir başka bir paragraf daha<p> Yani her <p> yeni paragraf başlatır.<p> Bir deneme daha.<p> </body>
</html>

 

Paragraf denememizi yazın ve deneme3.html olarak kayıt edin. Şimdi deneme3.html yi çalıştırın. Dikkat ederseniz browser her gördüğü <p> tagından sonra bir satır boşluk bırakıyor ve yeni bir paragrafa başlıyor. Önemli bir nokta dikkat edin. Şimdi bu yazdığımız sayfayı kontrol edin Artık birkaç deneme daha yaparsanız iyi olur. <p> tagı bizim için iyi bir kontrol aracıdır. Sayfa üzerinde hakimiyetimizi artırır. Yazıları kontrol etmek için daha birçok tag var. Şimdi bunlardan yeni birini inceleyelim. Satır sonu yapmak için <br> tagını, yazıyı ortalamak için <center>   </center> tagını inceleyeceğiz.

 

<html>
<head> <title>Paragraf oluşturma </title> </head>
<body>
 Şimdi br  tagını inceleyelim. p tagından farklı olarak paragraf yapmaz<br> sadece bir alt satıra geçer<br> Dikkat ettiniz mi, bir satır boşluk bırakmıyor<br> sadece bir alt satıra geçiyor.<br> Önemli bir fark.
</body>
</html>

 

Evet <br> tagı sadece satır sonu yapar. Yani bir alt satıra geçer. Yeni bir paragraf başlatmaz. <p> tagından bu yönden ayrılı. Hemen yandaki kodları yazın ve deneme4.html olarak kayıt edin. Sonra deneme4.html dosyasını çalıştırın. Dikkat edin satır sonu tagından hemen sonra bir alt satırdan yazı nasıl başlıyor. Birkaç deneme yapın. <p> ve <br> tagları arasındaki farkı hissedin. İki tagı aynı anda kullanan birkaç deneme yapın. Şimdi Deneme4.html yi çalıştıralım.

Br tagını da öğrendiğimize göre center tagına geçebiliriz.

 

<html>
<head> <title>Yazıyı ortalama</title> </head>
<body>
<center>CENTER TAGI</center>
 Dikkat ettiniz mi? başlık sayfayı ortalamış vaziyette.<p> Aynı şekilde istediğimiz <center>yazıyı ortalayabiliriz.</center>
</body>
</html>

 

Evet bir kelimeyi, yazıyı veya bir resmi ortalamak için kullanacağımız tag center dır. Bu tagı /center ile bitirmek gereklidir. Ortalama satır üzerinde olur. Browser center tagını gördüğünde bir satır aşağı atlar ve satırı ortalayarak yazıyı ekrana getirir. /center tagını görünce bir satır aşağı atlar. Sonuç yazımız ortalandı. Şimdi yandaki denemeyi yazın ve denem5.html olarak kayıt edin. Sonra çalıştırın. Sonucu görün. Bir kaç deneme yapın.Artık deneme5.html yi çalıştırabilirsiniz. Sonuç ortada web sayfası tasarlarken yazılar üzerinde kontrolümüzü sağlayan bu tagları iyi anlamak gereklidir. Birkaç deneme daha yapın, hepsini bir arada kullanın. Bir deneme olarak aşağıdaki satırları yazın ve bu üç tagı bir arada nasıl kullanabiliriz görün.

 

<html>
<head> <title>Yazılar üzerinde hakimiyet </title> </head>
<body>
<center> Yazılar Üzerinde Kullanılan Taglar </center>
 Hayatımızda kelimelerin tartışılmaz bir yerde bulunurlar. Kelimeler cümleleri oluştururlar. Cümleler bize çok şey anlatır. Bir yazıyı yazarken bu kelimeleri özenle seçeriz.<p> Aynı şekilde yazım kuralları da önemlidir. Bu bağlamda bir web sayfası tasarlarken bizler bazı kurallara <br>uymak ve sayfayı en güzel şekilde tasarlamak mecburiyetindeyiz.<p> Bu durumda tasarım yaparken kullanacağımız bazı taglar geliştirilmiştir. bu taglar bize tasarım kolaylığı sağlamaktadır. Doğru şekilde kullanıldığında çok güzel etkiler verirler.
<center>Hazırlayan: Özgür Boy</center>
</body>
</html>

 

Ders1 / Ders3