Ana Sayfa / Kodlama Dilleri / HTML Dosyası Örneği

HTML Dosyası Örneği

Örnek HTML Dosyası Örneği

Daha önceki anlatımlarımızda HTML ile ilgili temel bilgileri vermiştik. Bu anlatımımızda örnek bir html dosyasının nasıl olduğunu göreceğiz. Ana hatları ile HTML yazımındaki kuralları hatırlayarak aşağıdaki örneği takip ediniz.


<html>
  <head>
    <!-- Meta etiketleri ile ek bilgiler veriliyor -->
    <meta name="author" content="ÖÇ DESİGN">
    <meta name="description" content="HTML Sayfa Örneği">
    &lt;meta name=&quot;keywords&quot; content=&quot;web,html,<a href="http://www.grafiktasarimmedya.com/category/kodlama-dilleri"target="_blank" title="css" >css</a>,grafiktasarimmedya&quot;&gt;
    &lt;meta http-equiv=&quot;content&quot; content-type=&quot;text/html; charset=utf-8&quot;&gt;
    &lt;title&gt;İlk HTML Denemem&lt;/title&gt;
  &lt;/head&gt;

  &lt;!-- Body etiketi ile sayfamızdaki renkleri ayarlıyoruz --&gt;
  &lt;body text=&quot;#000000&quot; bgcolor=&quot;#ffffff&quot; link=&quot;#808080&quot; vlink=&quot;#eaeaea&quot; alink=&quot;#000000&quot;&gt;
    &lt;h1&gt; Bu büyük boyutlu ortalanmamış bir başlık&lt;/h1&gt;
    &lt;br /&gt;&lt;center&gt;
      &lt;h1&gt; Bu da büyük boyutlu bir başlık fakat ortalanmış.&lt;/h1&gt;
    &lt;/center&gt;

    &lt;!--
      Center etiketi ile ortalama bittiği için buradan sonra sola dayalı
      yazılacaktır.
    --&gt;
    &lt;br /&gt;&lt;br /&gt;
    &lt;font face=&quot;verdana&quot; size=&quot;5&quot; color=&quot;#800000&quot;&gt;
      Buradan itibaren paragrafıma başlayacağım.
    &lt;/font&gt;

    &lt;!-- p etiketi kendiliğinden bir satır boşluk verdiği için satır atlamadım --&gt;
    &lt;p&gt;
      Bu sayfayı yapmaktaki amacım etiketlerin ve bağlı kodların nasıl
      kullanıldığını göstermektir. Yukarıdaki kırmızı başlığı &amp;lt;font&gt;
      etiketini kullanarak elde ettim. İnternette gezerken ziyaret ettiğiniz
      sayfaların kaynağını görüntüleyerek de değişik teknikler öğrenebilirsiniz.
    &lt;/p&gt;

    &lt;!-- başka sayfalara link verelim --&gt;
    &lt;a href=&lt;a href=&quot;mailto:iletisim@grafiktasarimmedya.com&quot;&gt;mailto:iletisim@grafiktasarimmedya.com&lt;/a&gt;&gt;Bana e-mail yollayın&lt;/a&gt;&lt;br&gt;&lt;br&gt;
    &lt;br&gt;&lt;br&gt;

    &lt;!-- HTML dosyanızı yazdığınız dizine abc.png adli bir resim yerleştirin --&gt;
    Aşağıdaki resmin görüntülenmesi için HTML dosyanızın olduğu dizine
    &lt;b&gt;abc.png&lt;/b&gt; resmini oluşturmalısınız.&lt;br /&gt;
    &lt;a href=&lt;a href=&quot;http://www.grafiktasarimmedya.com&quot;&gt;http://www.grafiktasarimmedya.com&lt;/a&gt;&gt;&lt;img src=&quot;abc.png&quot; border=&quot;0&quot; alt=&quot;resimin açıklaması&quot;&gt;&lt;/a&gt;
    &lt;br /&gt;&lt;center&gt;
    &lt;hr width=80% /&gt;
    &lt;u&gt;Bu altı çizili bir yazı&lt;/u&gt;, &lt;i&gt;bu yana yatık, italik, bir yazı&lt;/i&gt;&lt;br /&gt;
    Bu sayfanın amacı &lt;acronym title=&quot;Hyper Text Markup Language&quot;&gt;HTML&lt;/acronym&gt;
    kodları hakkında bilgi vermektir.
    &lt;hr width=80% /&gt;

    &lt;!-- Sayfanın başında başlatmış olduğumuz body etiketini bitiriyoruz. --&gt;
  &lt;/body&gt;
&lt;/html&gt;

Burada gördüğünüz kodları boş bir metin sayfasına yapıştırıp, uzantısını “html” yaptığınızda internet tarayıcınızda nasıl göründüğüne bakabilirsiniz.

Yorum Yazın

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir