IMG ve HEADER tagleri.

Resim tagi olan img, tek bir etiketle açılır ve kapatılır:

<img />

Resmin adresi, boyutları ve kenarlıkları gibi bilgileri ise önceki dersimizde bahsettiğimiz özellik=”değer” formatında ekleriz:

<img özellik=”değer” />

Elbette ki birden fazla özellik ve değere yer verebiliriz.

Şimdi img taginde en çok kullanılan özellikleri ve değerlerinin cinslerini yazalım:

Özellik Alabileceği Değerler Örnek
src resim linki <img src=”http://img851.imageshack.us/img851/5412/dth6.png”/&gt;
alt yazı <img alt=”bir çiçek resmi” />
width sayı veya oran <img width=”50px”/> veya <img width=”20%”/>
height sayı veya oran <img height=”50px”/> veya <img height=”20%”/>
border sayı <img border=”3″ />
style CSS kodları <img style=”border-color:red;-moz-border-radius:14px;” />

Yukarıdaki özellikler arasından, src mutlaka belirtilmelidir. Border değerini de kesinlikle belirtmenizi öneriyorum. Çünkü İnternet Explorer, border değerleri belirtilmemiş resimlere kendi kafasına göre kenarlık ekler. Bu yüzden kenarlık eklemeyecekseniz bile border=”0″ diye belirtmenizde fayda var.

Şimdi sırasıyla bu özellik ve değerleri gözden geçirelim:

src özelliği ve değeri kesinlikle belirtilmelidir. Zaten resmin adresi olmadan resmi gösteremeyiz değil mi? Resminizin adresini belirtmediğiniz sürece resminiz sayfada görünmez. Bu konuda dikkat etmeniz gereken şey, resmin adresini href ile değil src ile belirliyor olmamız. src aslında kaynak anlamına gelen source kelimesinden geliyor.işte bunlar hep İngilizce yav J

Eğer bir resminiz varsa ve bunu internete koyup linkini edinmek istiyorsanız en basitinden http://imageshack.us

Alt:

Alt özelliği resmin acklamasını içerir.eğer resim görüntülenmezse resmin görüntülenmesi gereken alt değerinde yazılanlar görünür.bu değerleri oluşturan belli bi kurala bağlı kalmamıza gerek yok.

Resminizi açıklayan herhangi  bir metin koyabilirsiniz. Yada alt özelliğini eklemeyebilirsiniz. Ancak alt değeri  aynı zamanda arama motorlarının sayfamızı değerlendirirken kullandığı bir veri. Bu nedenle kullanmamızda fayda var. Alt kelimesini  ‘alternatif metin’ anlamında kullanabiliriz.

width özelliği, eklediğiniz resmin enini belirler. Piksel cinsinden bir değer yazmak için px kısaltmasını kullanabilirsiniz. Veya bulunduğu kısmın genişliğine göre oranlamak isterseniz sonuna % işaretini ekleyebilirsiniz. Örneğin bir hücrenin içine koyduğunuz resme width=”100%” yazarsanız, resim hücrenin genişliğinde olur. Eğer hiç bir kısaltma eklemeden sayı yazarsanız, Tarayıcı bunu da piksel olarak düşünecektir. Eğer hiç bir width değeri vermezseniz, Resmin kendi genişliği kullanılır. Veya yükselik değerini belirtmişseniz, genişliği de ona göre ayarlar.

height özelliği için de yukarıdaki şeylerden sözedebiliriz. Ancak height resmin genişliğini değil yüksekliğini belirler:

Border:değeri aslında çok basittir.3,5 gibi herhangi bir sayı yazarak kenarlağın yani çerçevenin genişiliğini belirleyebilirsiniz.

Ve geldik en önemli yerlerden birisine.RESİMLERE link vermek

Html dilinde tagleri kullanırız, ilk dersimizde bu tagleri kümelere benzetmiştik ve bazı kümelerin değerlerini kapsayabileceğini söylemiştik.

Resim kümesinin href özelliği yoktur.bu nedenle resimlere link vermek istediğimizde ,href özelliği olan bir tagin içine koyarız.ve bir tag çoğunlukla yazı kümesi olan ‘a’ dır.

BAŞLIK tagleri

Başlık tagleri aslında son derece kısırlaştırılmış birer yazı tagidir.başlık taglerini şu şekilde sıralayabiliriz.

 

Kod Önizlemesi
<h6>Merhaba</h6>  

Merhaba
<h5>Merhaba</h5>

Merhaba
<h4>Merhaba</h4>

Merhaba

<h3>Merhaba</h3>

Merhaba

<h2>Merhaba</h2>

Merhaba

<h1>Merhaba</h1>

Merhaba

 

Yours sincerely.

Gökhan ALKAN

HTML’e Giriş

html nedir nasıl kullanılır

web proglama için en uygun dildir,html bir progam deil betik dildir. Betik dil (İng. scripting language veya script language), uygulamaları denetlemek için kullanılan bir programlama dilidir. Betikler doğrudan kaynak kodundan çalıştırılır. Html kendi başına çalıştırılamaz web tarayıcısına ihtiyaç duyar. Html ile yazı, resim ve videoları birbirine bağlayıp kullanıcılara sunabiliriz.
html tag olarak adlandırılan etiketlerden ouşur.
En önemli etiketler :
<html>=html sayfası olduğunu belirtir.
<head>=bu etiket sayfamız hakkında bilgilerin verildiği etiketleri içerir.
<body>=sayfamızın kulanıcılar tarafınfan görülmesin istediğimiz metni resim,videolar burda sergilenir.
<title>=web tarayıcınızda sayfanın başlığını belirtir.
Açılan etiketler mutlaka kapatılmalıdr.,etiketler yan yana yada alt alta ,küçük ,büyük harfle yazılabilir. Html için derleyiciye ihtiyaç yoktur.
Not defterini hazırlayıp içeriğini hazırlattıktan sonra dosya uzantısını değiştirip(htm, html) yaparak html sayfası elde edebiliriz.

HTML sayfalar aslında kümelerden oluşur.farklı özelikli farklı kümeler vardır.
1-) Yazı kümesi nasıl oluşturulur. şöyleki yazı kümesinin sembölü ‘a’ dır bunu unutmamalıyız ! Küme oluşturmak 3 adımdan oluşur. küme aç,içine birşey yaz ,kümeyi kapat.
<a>HTML’e Giriş ! </a> = HTML’e Giriş ! diğer kümeleri oluşturmak için o kümelerin sembolleri ile kümeyi acıp kapatırız.

fieldest kümesi ise çerceveli alan oluşturulur.
kod=<fieldset><a>merhaba</a></fieldset>=merhaba Örneğin ‘center’ kümesini ele alalım. Bu da yazıları yatay olarak ortalar.<fieldset><center><a>merhaba</a></center></fieldset>= merhaba (çerceveli ve ortada)
Küme sembolerine etiket denir.,html kümelerden oluşur.küme sembölerine etiket denir.

2 ) Etiketlerin özelikleri ve değerleri: örneğin ‘a’ elementinin bir özeliğini kulanacaksak bunu açılış etiketinin içinde kullanırız.<a id=”değer”> merhaba </a>
Eğer sembölü ‘div’ olan bir elementi kullanacak olursak

icerik

özellik ve değerler: örneğin a kümesinin bir özelliği ”href” dir. Bu özellik link vermeye yarar. <a href =”http://google.com”>merhaba </a>=merhaba

Şimdi bide body elementi oluşturalım. Body elementi bulunduğu yeri kaplayan bir alan oluşturur ve içine başka elementler konulur. <body><a>Merhaba</a></body>=merhaba
Body elmentinin bi özelliğide ”bgcolor”dır. Bgcolor özelliği arka plan özelliğini verir. Doğal renk adıdır. özellik=”değer” kalıbını kullanırız.
<body bg color=”red><a>merhaba</a></body>=merhaba(arka plan kırmızı)
Şimdide a elementinin ”title” özelliğini kullanalım. Title özelliği elementin üzerine mouse ile bekletiğimizde küçük bir kutucukta açıklma gelir. ”title” özelliğnin değeri yazıdır yani herhangi bir yazıyı kullanabiliriz. <a title=”merhaba”> bu yazının üzerinde farenizi bekletin. </a>=bu yazının üzerinde farenizi bekletiniz. Burada bir başka şeye dikkatinizi çekmek istiyorum ki. Kodu yazarken araya boşluklar koydum ve boş satırlar koydum bunu yapmamın sebebi siz bişeyler göstermek. HTML kodlarında bir veya daha fazla boşluk koyarsak bu bir boşluk olarak görünür
ve satır atlamanın da faydası yoktur. istediğniz kadar satır atlayın tüm kodlarınızı aynı satıra yazmış gibi olursunuz ! Satır atlamak için ”br” olan sembölü kullanırız.tek özelliği bir satırlık atlama yapmasıdır. <a>selam </a><br/><a>nasılsın<a/>=selam nasılsın(alt altaolck). Dikkatinizi cektiyse br kapanış etiketi yok. Satır atlama için de kapanış tagi olmaz.
Bunlar:<br/>,<input/>,<img/>,<hr/> ‘dir. Örneğin hr yatay cizgi yerleştirmeye yarar.