TASARIM DÜNYASI - HTML KODLARI

 <!----Kodlar için uyarı yada hatirlatma yapmamızı saglar---->   AÇIKLAMA: Bu <!- taglar arasında yazdığımız yazılar ekrana yansımaz. gömülü kalır.

<!DOCTYPE Döküman Belirleme-->

 ÖRNEK: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> gibi.   AÇIKLAMA: <!DOCTYPE tagı ile hangi dökümanı kullandığımızı belirleriz.

<html>Tagı</html>

ÖRNEK: <html></html> AÇIKLAMA: Döküman hakkında bilgilerin başladığına dair haber veririz.

<head>Tagı</head>

 ÖRNEK: <head></head>   AÇIKLAMA: Döküman hakkında bilgileri head tagları arasına yerleştiririz. Bilgiler görünmez gömülü kalır.(css, javascript vb. bilgiler.)

<link>Tagı</link>

 ÖRNEK: <link rel="stylesheet" type="text/css" href="http://www.deneke.tr.gg/stildosyam.css" />    AÇIKLAMA: <link> tagı sitemizde veya başka bir sitede (adreste) bulunan "css stil" dosyalarını (kodlarını) çağırmak için kullanılan bir bağlantı görevi görür.<link> tagı, <head> ile </head> tagları arasında kullanılır.  ÖRNEK: <head> <link rel="stylesheet" type="text/css" href="/stildosyam.css" /> </head>

<body>Tagı</body>

 ÖRNEK: <body><body>   AÇIKLAMA: <body> tagı arasına eklediğimiz içerikler görünmesini istediğimiz içeriklerimizdir. Body tagı <head> tagından sonra gelir.

<p>Tagı</p>

 ÖRNEK: <p>Bu yazılar "paragraf" kullanılarak yazılmıştır.<p>   AÇIKLAMA: <p> tagı yazılarımızı "paragraf" halinde yazmamızı sağlar.

<pre>Tagı</pre>

 ÖRNEK: <pre>Burda alanda yazdığım yazılar yazdığım gibi görünüyor. N güsel :$ <pre>   AÇIKLAMA: <pre> tagı arasında yazılan yazılar yazıldığı gibi görünür. Örnek olarak; Hazırladığımız yazılarda satır atlatmak için <br> tagını kullanmaya gerek kalmaz.

<font>Tagı</font>

 ÖRNEK: <font>Yazımız</font>   AÇIKLAMA: <font> tagını kullanarak, yazılarımıza renkler, boyutlar, açıklamalar, (title) değişik stiller  ekleyebiliriz.     Örnek olarak; <font style="color:blue; font-size:2em;font-family:roman;" title="font kod açıklaması">gibi, özellikler belirtebiliriz.</font>

<i>Tagı</i>

 ÖRNEK: <i>Bu tagın arasındaki yazılar italik (eğik) yazılmıştır.<i>   AÇIKLAMA: <i> tagı yazılarımızı italik (eğik) olarak yazmamızı sağlar.Bu tag arasında yazılan makale veya yazı, ince halde eğik olarak görünür

<b>Tagı</b>

 ÖRNEK: <b>Bu yazılar bold (kalın) yazılmıştır.<b>   AÇIKLAMA: <b> tagı yazılarımızı bold (kalın) belirgin olarak yazmamızı sağlar.Bu tag arasında yazılan makale veya yazı, belirgin (kalın) halde görünür.

<u>Tagı</u>

 ÖRNEK: <u> Tagı ile altı çizgili yazı yazıyorum.</u>   AÇIKLAMA: <u> tagı arasında yazdığımız yazılar, "altı çigili görünür." Genelde üstünü basa basa, anlatmak istediğimiz kelimeler için kullanırız.

<br>Tagı</br>

 ÖRNEK: Ali yaklaşarak, sordu:<br> Sema hanım nasılsınız?<br> Sema cevap verdi:<br> Teşekkürler Ali bey iyiyim, siz nasılsın?    AÇIKLAMA: <br> tagı yeni "boş" bir paragraf oluşturmamızı ve yazılarımızın "alt altta" gelmesini sağlar. Uzun bir anlatım (metin,  yada makale) yapacaksanız eğer, <br> tagı yerine <pre> tagını kullanmanızı tavsiye ederim. Yazılarınız ilk düzenlenlediğiniz gibi (normal haliyle) görünür.  <PRE> TAGI İÇİN BİR ÖRNEK:  <pre> Ali yaklaşarak, sordu: Sema hanım nasılsınız? Sema cevap verdi: Teşekkürler Ali bey iyiyim, siz nasılsın? </pre>

<s>Tagı</s>

 ÖRNEK: <s>Örnek kullanım.</s>    AÇIKLAMA: <s> tagı içinde kullanılan yazılar üzeri çizgili olarak ekrana yansır. Genelde yalnış yazılan yazılara örnek olarak kullanırız.

<code>Tagı</code>

 ÖRNEK: <code>Yazıyı genişleterek özel bir yazı tipi tanımlar.</code>   AÇIKLAMA: <code> tagı içinde yazdıımız yazılar italik şeklinde ve genişlik aralıklar halinde ekrana yansır. Genelde kod paylaşımı için kullanırız.

<cite>Tagı</cite>

 ÖRNEK: <cite>Örnek tag kullanımı.</cite>     AÇIKLAMA: <cite> tagı içinde yazdıımız yazılar italik olarak ekrana yansır.

<hr>Tagı</hr>

 ÖRNEK: <hr align=left color=blue size=10 width=300>  SADE KULLANIMI: <hr>   AÇIKLAMA: <hr> tagını sayfayı ayırmak ortadan çizgi halini alması için kullanırı. Tablo çizgilerine benzer bir çizgi çizer.

<h1>,<h2>,<h3>,<h4>,<h5> ve <h6> Tagları</h1>

 ÖRNEK KULLANIMLAR: <h1>Başlık Yazımız</h1>  <h2>Başlık Yazımız</h2>  <h3>Başlık Yazımız</h3>  <h4>Başlık Yazımız</h4>  <h5>Başlık Yazımız</h5>  <h6>Başlık Yazımız</h6>    AÇIKLAMA: <h1> ile başlayıp <h6>'ya kadar değer verilebilen bu taglar belli birer değerlere sahip olup, başlıklar oluşturmamızı sağlar. Stil referansları belirtilerek, başlıklarımızı daha görkemli bir hal almasını sağlayabiliriz.

<a>Tagı</a>

 ÖRNEK: <a href="Url adresi" title="Açıklama mesajı">Link Adı</a>   AÇIKLAMA: <a> tagını kullanarak yazılarımıza link verebiliriz. A tagının diğer bir adı <link>'tir ve XML'de kullanılır. <a> tagı bizi yada ziyeretçilerimizi istediğimiz bir yola (adrese) (url'ye) yönlendirmesini sağlarız.   KULLANIM ÖRNEĞİ: <a href="http://www.deneke.tr.gg/css.htm" title="Css Kodları hakkında bilgiler">Css Kodları</a>

<img>Tagı</img>

 ÖRNEK: <img src="Resmin Url adresi" title="Resmin Açıklaması" alt="Resmin adı"></img>   AÇIKLAMA: <img> tagını resim eklemek için kullanırız. <img> tagını kullanırken </img> şeklinde kapatmaya gerek yoktur.   KULLANMA ÖRNEĞİ: <img src="https://img.webme.com/pic/d/deneke/html1.jpg" title="Html kodları" alt="Deneke Html"></img>

Örnek bir resim. » Html

<ul><li>Listeleme Tagları</li></ul>

 ÖRNEK: <ul> <li>Liste</li> <li>Listeler</li> <li>Listeleme</li> <li>Listelemeler</li> </ul>   AÇIKLAMA: <ul> tagı içinde <li> taglarını kullanarak listeleme yapabiliriz.<li> tagı (listeleme), <ul> tagı ile başlar ve aynı şekilde </ul> tagı ile sonlandırılır.

<ol><li>Listeleme Tagları</li></ol>

 ÖRNEK: <ol> <li>Liste</li> <li>Listeler</li> <li>Listeleme</li> <li>Listelemeler</li> </ol>   AÇIKLAMA: <ol> tagı numaralı listeleme yapmamızı sağlar. Numaralı listeler oluştururken, liste başlarına; 1.liste 2.liste gibi sayıları yazmaya gerek kalmadan <ol> tagını kullanarak numaralı listeler oluşturabiliriz.

<marquee>Tagı</marquee>

<marquee>Örneği: <marquee>Burda yazımız var</marquee>
Kayan yazı örnekleri için tıklayın.

 ÖRNEK: <marquee></marquee>   AÇIKLAMA: <marquee> tagını yazılarımızı sağdan sola, soladan sağa, aşağıdan yukarıya, yukarıdan aşağıya kaymasını sağlamak için kullanırız.

<comment>Tagı</comment>

 ÖRNEK: <comment></comment>    AÇIKLAMA: <comment>tagı içinde yazdığınız yazılar web sayfasında görünmez gömülü kalır.

<center>Tagı</center>

 ÖRNEK: <center>Burdaki içeriklerimiz ekran ortalanarak görünür.</center>    AÇIKLAMA: <center>tagını yazı yada içeriklerimizi ortalamak için kullanırız.

<iframe>Tagı</iframe>

 ÖRNEK: <ifame src="http://www.deneke.tr.gg/css.htm" border="0" width="600" height="900"></iframe>    AÇIKLAMA: <iframe> tagını başka bir sitedeki içeriği (video, resim) veya sayfayı olduğu gibi kendi sitemizde göstermek için kullanırız.