3 - Biçimlendirme Ve Listeleme Etiketleri

-3-
HTML Etiketleri
ve
Parametreleri
Öğr. Gör. Aslan BALAN
Harran Üniversitesi,
Viranşehir MYO
KONU BAŞLIKLARI
 ve <hr> etiketlerinin kullanımı ve parametreleri
 Biçimlendirme Etiketleri ve parametreleri
 Başlık Etiketleri
 Paragraf Etiketi 
 Kalın veya etiketi
 italik veya etiketi
 altı çizgili etiketi
 Üstü çizili <s> veya strike etiketi
 <big>, etiketi
 Üs alma etiketi ve İndis Etiketi
 Font Etiketi 
 Listeleme Etiketleri
 Sıralı (numaralı) Listeleme Etiketi <ol>
 Sırasız (madde imli) Listeleme Etiketi <ul>
 Tanımlama Listeleme Etiketi <dl>, <dt>,<dd>
Alt Satır Etiketinin
Kullanımı
 HTML’de etiketi, düz metin içeriğinde

bir satır alta geçilmesini sağlar.
 BR etiketi sonlandırma etiketi bulunmayan

etiketlerden biridir. Sonlandırma etiketi
bulunmayan etiketler şeklinde de
yazılabilir.
Alt Satır Etiketinin
Kullanımı
 Örnek:
Bu benim 1.
satırım 
Bu da benim 2.
satırım 
Bu da 3. satırım.
 Bu da 4. satırım.
Çizgi <hr> Etiketinin Kullanımı
 Buetiketin amacı sayfanıza yatay bir çizgi
eklemektir. Yatay çizgiyi dökümanın bir
parçası olarak gösterir.
 HR etiketi de tıpkı BR etiketi gibi

sonlandırma etiketi bulunmayan
etiketlerden biridir. <hr/> şeklinde de
yazılabilir.
Çizgi <hr> Etiketinin Kullanımı
 Örnek:
<html>
<title> HR Etiketi </title>
<body>
<hr>
<hr color=red> ( Renk verir)
<hr color=blue size=5> ( Kalınlık
verir)
<hr color=green width=500>
(Genişlik verir)
<hr color=green width=500
align=right> (sağa yanaştırır)
</body>
</html>
Biçimlendirme Etiketleri
 HTMLçok sayıda biçimlendirme etiketi
sunar. Bu etiketlerle belgeye başlık,
paragraf, kalın-italik-alt çizgili, fontlar gibi
biçimlendirme uygulanabilir.
 HTML etiketleri birbirine bağlı değildir.

Etiketleri kullanmak için belli bir sıra
yoktur. İstenildiğinde kullanılabilir.
Başlık Etiketleri
 HTML etiketlerinde ana başlık ve alt başlıkları
düzenlemek adına belirlenmiş 6 tane başlık vardır .
Bunlardan en büyüğü <h1>, en küçüğü <h6> dır.
Başlık etiketlerinde Web tarayıcı tarafından otomatik
olarak bir alt satıra geçme etiketi uygulanır.
Paragraf Etiketi
 Paragraf etiketi Web sayfasındaki paragrafları
tanımlamak için kullanılır. HTML dili otomatik
olarak paragraf etiketlerinin öncesinde ve
sonrasında bir satır atlar. Paragraf etiketinin
varsayılan olan metni “sola” dayalı olarak
yazar. Eğer istenirse align parametre özellikleri
değiştirilerek metnin “ortalı” yada “sağa”
dayalı olarak yazılabilir.
 Paragraf etiketi için etiketi sonlandırmalı

olarak kullanılır.
Paragraf Etiketi
 Örnek:
Sola dayalı olması için:

Yazınızı buraya yazacaksınız
Ortada olması için:

Yazınızı buraya
yazacaksınız
Sağa dayalı olması için:

Yazınızı buraya
yazacaksınız
Kalın, İtalik, Altı Çizili
Kalın (Bold) yazı

Yazınızı buraya
yazacaksınız
 
Eğik (İtalik) yazı
Yazınızı buraya
yazacaksınız
 
Altı çizgili (underline) yazı
Yazınızı buraya
yazacaksınız
Kalın, İtalik, Altı Çizili
Kalın (Bold) yazı

Yazınızı buraya
yazacaksınız
 
Eğik (İtalik) yazı Yazınızı
buraya yazacaksınız
 
Altı çizgili (underline) yazı
Yazınızı buraya
yazacaksınız
 
<s> yazınızı buraya</s>
Big ve small etiketleri
<big>büyük yazı</big>
 
normal yazı
 
 küçük yazı 
Üs Alma Etiketi
X3
 İndis Etiketi
X2
Font Etiketi
 Font etiketi ile varsayılan olarak belirlenmiş metin
rengi, boyutu yada yazı tipi özelliği değiştirilebilir.
Bunun için kullanılan etiket .. 
tur. Font etiketi başlangıç seviyesinde ki
kullanıcılar için kullanılırken ileri seviyelerde bu
işlem stiller(CSS) ile yapılmaktadır.
 ............... 

USKMYO
Ayrıca renklerin kodları kullanılabilir.
blue - #0000ff
yellow - #ffff00
white - #ffffff
black - #000000
Listeleme Etiketleri
 Web sayfalarında kullanılan 3 tür liste vardır.
Bunlar:
1. Sıralı Liste (Ordered List)
2. Sırasız Liste (Unordered List)
3. Tanım Listesi (Definition List)
Yukarda bahsedilen bu üç listeyi oluşturmak için

sırasıyla ol, ul ve dl etiketleri kullanılır.Bunları
şimdi detaylı inceleyelim.
Sıralı (numaralı-ordered list) Listeleme Etiketi <ol>
 Sıralı ve sırasız listeler arasındaki tek fark, sıralı
listede madde işareti yerine 1,2,3 gibi rakamlar,
sırasız listede ise madde işaretlerinin kullanılıyor
olması.
 Sıralı listeleri oluşturmak için <ol> ....</ol> etiketini
kullanıyoruz. Bu etiketlerin arasında ise her bir liste
elemanı için <li> ....</li> etiketi oluşturuyoruz.
 Örnek:
<ol>
<li>ASP.NET</li>
<li>HTML</li>
<li>CSS</li>
</ol>
Sıralı (numaralı-ordered list) Listeleme Etiketi <ol>
 Sıralı Liste oluşturmak için <ul>.....</ul> etiketi
kullanılır. Bu etiketlerin arasında ise her bir liste
elemanı için <li>......</li> etiketi kullanılır.
 Örnek:
<ul>
<li>ASP.NET</li>
<li>HTML</li>
<li>CSS</li>
</ul>
Sıralı ve Sırasız listeleme etiketlerinin
iç içe kullanımı
 Örnek:
<ol>
<li>En sevdiğim yaz meyveleri:
<ul>
<li>Kayısı
<li>Şeftali
<li>Erik
<li>Üzüm
</ul>
 
<li>En sevdiğim kış meyveleri:
<ul>
<li>Portakal
<li>Mandalina
<li>Nar
<li>Ayva
</ul>
</ol>
Tanımlama Listeleme Etiketi
 Tanımlama listelerinde (definition list) amaç
maddeleri sıralama değildir. Burada adından
da anlaşılacağı gibi tanımlama yapılır.
 Her bir tanımlama listesinin başlangıcı için
<dl>..</dl> etiketi kullanılır. Madde
sıralamada kullanılan <li> etiketi yerine <dt>
ve <dd> etiketleri kullanılır.
 Açıklanacak terim <dt>..</dt> ile
oluşturulurken tanımlama işleminin yapıldığı
bölüm <dd>..</dd> dir.
Tanımlama Listeleme Etiketi
 Örnek:
<dl>
<dt> En sevdiğim hayvanlar
<dd>Kediler ve kaplumbağalardır. 2 kedim var. Biri beyaz biri
sarman. İsimleri ipekpisi ve sütlü...
Kaplumbağalarım suda yaşıyan cinsten ve onlar da iki tane...
<dt> En Sevdiğim çiçekler
<dd>Papatyalara bayılırım. Her türlü kır çiçeğini severim.
Tabii beyaz gülleri de...
<dt> En sevdiğim yemekler
<dd>Köfte ve pilav başta gelir. Kurufasulye, karnıyarık ve
biber dolmasını çok severek yerim
</dl>

3 - Biçimlendirme Ve Listeleme Etiketleri

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

3 - Biçimlendirme Ve Listeleme Etiketleri

Uploaded by

Copyright:

Available Formats

-3-

 HTML’de <br> etiketi, düz metin içeriğinde

 BR etiketi sonlandırma etiketi bulunmayan

 HR etiketi de tıpkı BR etiketi gibi

 HTML etiketleri birbirine bağlı değildir.

 Paragraf etiketi için <p> etiketi sonlandırmalı

Sola dayalı olması için:

Ortada olması için:

Sağa dayalı olması için:

Kalın (Bold) yazı

Kalın (Bold) yazı

<font> ............... </font>

Yukarda bahsedilen bu üç listeyi oluşturmak için

You might also like