Benim sitem

HTML Dersleri

Basit HTML Etiketleri

Şimdiye kadar gördüğünüz derslerde HTML'in ağır toplarıyla tanıştınız. Dersleri dikkatli takip ettiyseniz, artık standart bir web sayfası yapabilirsiniz. Şu andaki bilgilerinizle, görsel, kişisel bir sayfa yapabilirsiniz. Bu sayfayı bedava hosting(web alanı) sunan sitelerden birine atarak webe ilk adımınızı atabilirsiniz.Yalnız bilmelisinizki, daha bilmeniz gereken çok şey var. İyi şeyler yapmak için vakit harcamalısınız. Güzellik çoğu zaman ayrıntılarda gizlidir. Bu dersimizde HTML'in göze batmayan ama hayati önem taşıyan özelliklerinden birkaçını huzurlarınıza sunacağım. Bunların tamamı "<>" tagları ile kullanılmakta ve aksini belirtmediğim sürece kapatılması gerekmektedir.

br: Bu etiket, satır atlamak için kullanılır. HTML kodunu tarayıcınız en baştan başlayarak sona doğru sırayla okur. İsterseniz tüm kodları tek satırda da yazabilirsiniz, birşey fark etmez. Ama siz düz metin yazarken enter tuşu ile alt satıra geçtiğinizde tarayıcınız bunu algılamaz ve yazdıklarınızı yanına eklemeye devam eder. Düz metinde o andan itibaren bir alt satıra geçmek için br etiketini kullanırız. br etiketini kapatmaya gerek yoktur. İki kere kullanırsak bir satır boşluk bırakır.

p:HTML'de paragraf amak için bu etiketi kullanırız. Bu etiket arasında kalan metinleri paragraf şeklinde düzenler. Kapatılması zorunlu değildir. Kapatılmazsa, metinin sonuna kadar paragraf kabul eder.

b:Bold, yani kalın yazı manasına gelir. Belirgin olmasını istediğiniz yazıları "b" etiketi ile kalın yazabilirsiniz.

i:italik, yani eğik yazı manasına gelir. Belli kelimeleri yada paragrafı eğik şekilde yazmak istiyorsanız, paragrafın yada kelimenin başına ve sonuna "i" etiketi getirilmesi zorunludur.

center:Bu dersin en önemli tagıdır. Türkçe'de "ortalanmış" manasına gelir. "center" "/center" etiketleri arasına ayzdığınız yazılar, koyduğunuz resimler, tabolar kısaca herşey sayfaay ortalanır. Bu çoğu zaman şekilde göze hoş gelir.

Arka Plan Rengini Değiştirmek

Varsayılan olarak sitenizin arka planı beyaz görünür. Bu sitenize belli bir sadelik, ferahlık getirsede, çoğu zaman bunu değiştirmek isteriz. Farklı bir renk, hatta belli bir fotoğrafla arka planınızı döşemek ister miydiniz? Bu ders işte bunun için. Bunu yapmak içinde her zamanki gibi body etiketini kullanacağız ama bu sefer biraz farklı bir şekilde. Bu sefer kodlarımızı body etiketinin altına değil, bizzat body etiketinin yanına yazacağız. Şöyleki "body bgcolor="#000000" Bu kod arka planı siyah yapacak mesela. bgcolor etiketi arka planın rengini belirlerken kullanılıyor. #000000 ise siyah rengin HTML dilindeki karşılığı. Bunun gibi tüm renklerin karşılıklarını netde aratıp bulabilirsiniz. Şimdi biz yapacağımız örnekte arka planı siyah, yazı renginide beyaz yapalm mesela. Bunun için aşağıdaki kodu kullanmamız gerekir.



Sitede Resim Göstermek

Sitenize resim ekleme işini  "img" etiketimiz üstlenmekte. bu sefer "a href" yerine "img src" bağıntısını kullanacağız. Burdaki src, source yani kaynak manasına gelir. Resminizin webdeki kaynağını buraya yazarsınız. Yani sitenizde resim yayınlamak için, önce onu webdeki bir sunucuya atmanız ve linkini kopyalamanız gerekmektedir. Geri kalan işlemler aynı link vermedeki gibidir.


MailTo

Yazınızda mail adresi vermek istiyorsanız, bunu bir önceki dersimizde anlattığımız link verme konusundaki gibi halledebilirsiniz. Burda farklı olarak kullanacağımız tek şey "mailto" etiketi. Yine "a href" etiketini kullanacağız. Sadece yazıya tıklanıldığında gidilecek olan urlyi yazarken "mailto:mailadresiniz@örnek.com" şeklinde yazmalısınız. Bundan sonra yine tıklanılacak olan nesneyi belirtip, tagları ile birlikte etiketi kapatmalısınız. Pratikte link vermekten pek bir farkı yok gibi.

Link Atama

Sitenize link koymak istiyorsanız, "a href" etiketini kullanmanız gerekir. Bu oldukça basit bir işlemdir ama karışık gibi gözükür. Bunun nedeni işin ayrıntıda gizli olmasıdır. Vereceğiniz linkin birçok özelliği olabilir. Linki yeni pencerede mi, yoksa yeni tabda mı açacağınızı; linkin üstüne mouse ile geldiğinizde orda ne yazacağı vs. gibi işleri bu bölümden ayarlarız.
Link dediğimiz şey, ilgili nesneye tıklandığında gidilen urldir aslında. Burada belirtmemiz gereken iki temel nokta var. Birincisi hangi nesneye link vereceğimiz, ikincisi nesneye tıklanıldığında hangi urlye gideceği. Aşağıda basit bir link uygulaması vardır.



http://htmldersleri.blogcu.com/ ' dan alıntıdır !


HTML'de harfleri koyu, eğik veya altı çizili yapmaya yarayan komutları görmüştük. Aşağıda hem daha önce gördüklerimiz, hem de yeni göreceğimiz kodlar yer alıyor:


<b></b>

Harfleri koyulaştırır.(bold)

<strong></strong>

Harfleri koyulaştırır.

<big></big>

Harflerin boyutunu büyütür.

<small></small>

Harflerin boyutunu küçültür.

<em></em>

Harfleri eğik hale getirir.(emphasized)

<i></i>

Harfleri eğik hale getirir.(italic)

<sub></sub>

Harfleri alt simge haline getirir. (subscript)Örn: O2

<sup></sup>

Harfleri üst simge haline getirir. (superscript)Örn: m² gibi

<del></del>

Harfleri üstü çizili hale getirir. (deleted)

<ins></ins>

Harfleri altı çizili hale getirir. (inserted)

<u></u>

Harfleri altı çizili hale getirir.(underlined)

<!-- -->

HTML açıklamalrı <!-- ile başlar ve --> ile biter. Bu iki tag arasında kalan bütün yazılar browser tarafından ihmal edilir

<nobr></nobr>

Hiçbir zaman yeni satıra geçmiyor.

<strike> </strike>

Üzeri çizili yazı oluşturmak için kullanılır. Aynı işi <s></s> yapmaktadır.

<pre> </pre>

Yazıların göruntüsünde ayarlama yapılmaz. Yani birden fazla boşluk varsa bunlar bir tane olacak şekilde azaltılmaz.

<tt></tt>

Arasına yazılan metni "teletip metin" moduna çevirir.

<address></address>

Adres bölümleri için kullanılır. Genelde italik olarak render edilir.

<bdo dir="rtl"></bdo>

Arasına yazılan metinsel ifadeyi tersine çevirir. "Banu"'yu "unaB" yapar. Bu kod olmasaydı, insanoğlu n'apardı bilemiyorum.

<code></code>

Arasına yazılan metni "code" (kod) moduna çevirir. program kodlarını web sayfasına yazacaksanız,

<ACRONYM TITLE="x"> </ACRONYM>

Arasında kalan metin genellikle bir kısaltmadır. Mause imleci kısaltmanın üzerine geldiğinde kısaltmanın manası görüntülenir. Bunun için x yerine kısaltmanın açılım

<kbd></kbd>

Arasına yazılan metni "keyboard" (klavye/daktilo) moduna çevirir.

<sample></sample>

Arasına yazılan metni "sample" (örnek) moduna çevirir.

<abbr></abbr>

Arasına yazılan metni yine kısaltma moduna çevirir.

<blink> ve </blink>

arasındaki yazılar ise yanıp söner

&nbsp

(Birden fazla Boşluk vermek) Bir karakterden daha fazla boşluk vermek için kullanılır.

<blockquote></blockquote>

Kenardan 40 piksel daha içeriye yazı yazmanızı sağlar

<SPAN>…</SPAN>

bir dokümanin küçük bir kismini kendi blogu içine alir. <DIV> gibi

<blink></blink>

Yanıp Sönen Yazı Yapmak İçin..

<CITE> </CITE>

<i></i> tagında olduğu gibi italik yazı yazmaya yarar..

http://html-dersi.blogspot.com/ ' dan alıntıdır !