HTML ÖZEL KARAKTER STİLLERİ

Hazırladığımız dokümanda kullanmak istediğimiz özel karakter stilleri olabilir. Örneğin bir yerden alıntı yapmak istediğimizde, alıntı yaptığımız yazıların biraz eğik (italik gibi) görünmesini isteyebiliriz. Ya da bazı vurguladığımız kısımların daha çok göze çarpmasını isteyebiliriz. HTML’ de bu gibi özellikleri sağlayan belirteçler de vardır. Bunlar aşağıdaki gibidir.

<EM> Önemli bir yazı </EM> {Bu belirteç vurguyu belirtmek için kullanılır. (Dışarıya biraz eğik çıkar.) }

<STRONG> Çok önemli bir yazı </STRONG> {Bu belirteç çifti güçlü vurguyu belirtir. (Dışarıya biraz koyu çıkar.) }

<CODE> Yazılar yazılar </CODE> {Bu belirteç çifti yasa, kural belirten yazılar için kullanılır. }

<SAMP> Örnek </SAMP> { Örnek çıktı }

<VAR> Değişken, emin değil </VAR> {Değişken, kararsız }

<DFN> Tanımlama </DFN> {Bu belirteç çifti tanımlama belirten yazılar için kullanılır. (Dışarıya hafif eğik çıkar.)}

<CITE> Alıntı </CITE> {Bu belirteç çifti alıntı yazılar için kullanılır. }

<SMALL> Küçük yazı </SMALL> {Bu belirteç çifti arasında yazılan yazılar dışarıya çok küçük çıkar. }

<BIG> Büyük yazı </BIG> {Bu belirteç çifti arasında yazılan yazılar dışarıya çok büyük çıkar. }

<ADDRESS> Yazarın Adresi </ADDRESS> {Bu format yazarın adresini yazmak içindir. }

<BLOCKQUOTE> İçeriden başla </BLOCKQUOTE> {Bu belirteç çifti arasına yazılan yazı sayfanın hem sağından hem solundan içeriye kayar. }

<DIV ALIGN=LEFT|CENTER|RIGHT> Herhangi bir yazı ya da yazı grubu </DIV> {Bu belirteç çifti herhangi bir yazı ya da yazı grubunun sağa, sola ya da ortaya yaslanmasını sağlar. }

<CENTER> Ortalanacak yazı </CENTER> {Bu belirteç çifti yazı ve resimleri sayfada ortalar . }

<PRE> Formatlı metin </PRE> {Bu belirteçler arasına yazılan her şey, yazıldığı gibi ekrana çıkar. Boşluklar, tab' lar, satır bölmeleri vb korunur. }

<BLINK> Yanıp sönen yazı </BLINK> {Bu belirteç çifti arasına yazılan yazılar dışarı çıktıklarında bir yanıp bir sönen şekilde görünürler.}

HTML Nedir?

HTML (HyperText Markup Language/Hareketli-Metin İşaretleme Dili) basitçe, browserlarla görebileceğimiz, Internet dokümanları oluşturmaya yarayan bir çeşit dil. "Internet dokümanı" ifadesinin yanı sıra HTML ile oluşturduğunuz belgeleri hard diskinize kaydedebilir ve Internet bağlantınız olmasa bile bu belgeleri görüntüleyebilirsiniz.

HTML dokümanı hazırlamak için her hangi bir text dosya yazabilecek bir editör olması yeterlidir. Bütün yapılması gereken dokümanı HTML kurallarına uygun bir şekilde yazmak ve de dosyayı ".htm" ya da ".php3" olarak kaydetmektir. Ne derleme ne de ".exe" gibi dosyalara çevirme işlemi yoktur. Tek yapılması gereken hazırlanan bu dosyanın bir Internet tarayıcı programı tarafından çağrılmasıdır.

Herhangi bir Internet erişim programından bir HTML dokümanının kodlarını görmek istiyorsanız o sayfa üzerinde mouse sağ butonu kullanarak görülebilir. Özellikler menüsünden kodu göster (view source) seçeneğini seçiniz (ya da internet erişim programının göster (view) menüsünden source (kod) seçeneğini seçiniz).

HTML DİLİNDE TEMEL KOMUTLAR

HTML (HyperText Markup Language/Hareketli-Metin İşaretleme Dili) basitçe, browserlarla görebileceğimiz, Internet dokümanları oluşturmaya yarayan bir çeşit dil. "Internet dokümanı" ifadesinin yanı sıra HTML ile oluşturduğunuz belgeleri hard diskinize kaydedebilir ve Internet bağlantınız olmasa bile bu belgeleri görüntüleyebilirsiniz.

HTML dokümanı hazırlamak için her hangi bir text dosya yazabilecek bir editör olması yeterlidir. Bütün yapılması gereken dokümanı HTML kurallarına uygun bir şekilde yazmak ve de dosyayı ".htm" ya da ".php3" olarak kaydetmektir. Ne derleme ne de ".exe" gibi dosyalara çevirme işlemi yoktur. Tek yapılması gereken hazırlanan bu dosyanın bir Internet tarayıcı programı tarafından çağrılmasıdır.

Herhangi bir Internet erişim programından bir HTML dokümanının kodlarını görmek istiyorsanız o sayfa üzerinde mouse sağ butonu kullanarak görülebilir. Özellikler menüsünden kodu göster (view source) seçeneğini seçiniz (ya da internet erişim programının göster (view) menüsünden source (kod) seçeneğini seçiniz).

Tag Nedir?

•web sayfası oluşturmak için kullanılan komutlara tag denir.

•<tag>.....</tag> şeklinde kullanılır.

•tagların arasında kalan metne “tag içeriği” denir.

•tag’ler büyük harfle veya küçük harfle yazılabilirler. genelde küçük harf tercih edilir.

Yüzen kutu ve Konumlandırma Özellikleri

CSS ile web sitesi kodlamanın en önemli özelliklerinden iki tanesidir float ve clear.

Float bir elemanı Normal Akısın dışına çıkarmak için kullanılan bir yöntemdir. Bir biri ardına sıralanmış elemanlara float uygulandığında elemanlar eğer yeterli alan varsa yan yana dizilirler. Float Dinamik Göreceli Konumlandırma gibidir ve bu amaçla kullanılabilir.

Clear özelliği ile float uygulanmış elemandan sonraki elemanlara float etkisini durdurmamız mümkündür. Örneğin iki paragrafınız olsun ve bunlardan sadece ilkini float uygulanmış elemanın yanına koymak istiyorsunuz, bu durumda ikinci paragrafa clear özelliği atadığınızda bu eleman float uygulanmış elemanın altında konumlanacaktır.

Örnek: 

Aşağıdaki kural class="icon" öznitelikli bütün <img> çerçevelerini sola yanaştıracaktır (ve sol kenar dış boşluğunu '0‘ yapacaktır):

IMG.icon

{

   float: left;

  margin-left: 0;

}

<!DOCTYPE html>

<html>

<head>

<style>

      span { float: left; border: thin solid; margin: 2px }

      body, p, img { border: thin solid; margin: 2.35em }

      p { background-color: #eee;  padding: 5px }

    </style>

  </head>

  <body>

    <p><span><img src=k_1.jpg alt="Bu resim bir yüzen çerçeveyi simgeler"></span>Resim çerçevesi sola yanaştırılır. Devamındaki

    içerik yüzen çerçeveyle aynı satırdan başlayarak  yüzen çerçevenin

    sağında biçimlenir. Yüzen çerçevenin sağındaki satır çerçeveleri

    yüzen çerçevenin varlığından dolayı daraltılır fakat yüzen

    çerçeveden sonra normal genişliklerine dönerler.

  </body>

</html>