Hadi HTML5 Kullanalım - Basit Bir Index

Site Yöneticisi
Kullanıcı avatarı
Mesajlar: 120
Kayıt: 28 Mar 2007, 00:00
Konum: Orléans/France

Hadi HTML5 Kullanalım - Basit Bir Index

Mesajgönderen Roi Intrépide » 11 Mar 2012, 00:07

Yeni bir metin belgesi oluşturun, ardından uzantısını .html olarak değiştirin ve kodları ekleyin.. Hepsi bu kadar!

Kod: Tümünü seç
<!DOCTYPE html>
<!-- html ile başlamamalı, dil tanımlaması ve yazının yönü de belirtilmelidir. -->
<html dir="ltr" lang="tr-TR">
<head>
<m e t a charset="UTF-8" /> <!-- Karakter seti mutlaka tanımlanmalıdır. -->
       <title>HTML 5 Demo</title>
   <script>
      document.createElement('header');
      document.createElement('nav');
      document.createElement('section');
      document.createElement('article');
      document.createElement('aside');
      document.createElement('footer');
   </script>
   <style>
      header,nav,section,article,aside,footer {display:block;border:1px solid #bbb;padding:1em;}

      header,nav,section,article,aside,footer {border:1px solid #bbb;padding:1em;}
      header{background-color:#EFFBFF;}
      h1,h2,nav li {font-family:helvetica,arial,sans-serif;}
      nav{margin:1.5em 0;}
      nav li {display: inline;list-style-type: none;padding-right:1em;}
      article,aside{float:left;margin-bottom:1.5em;}
      article {width:60%;}
      aside {width:28%;margin-left:1em;}
      footer {clear:both;}
      .identifier {background-color:#FFF79F;font-style:italic;}
   </style>
    </head>
    <body>
        <header>
      <p class="identifier">header</p>
               <h1>HTML 5 Demo</h1>
        </header>
        <menü>
      <p class="identifier">nav</p>
      <ul>
         <li>Anasayfa</li>
         <li>Hakkımda</li>
         <li>İletişim</li>
      </ul>
        </menü>
   <article>
      <p class="identifier">makale</p>
      <h2>Deneme Başlığı</h2>
      <section>
         <p class="identifier">bölüm</p>
         <ul>
            <li>deneme, deneme,deneme, deneme,deneme, deneme.</li>
            <li>deneme, deneme,deneme, deneme,deneme, deneme.</li>
            <li>deneme, deneme,deneme, deneme,deneme, deneme.</li>         </ul>
      </section>
   </article>
   <aside>
      <p class="identifier">yan</p>
      <h2>Deneme-2</h2>
      <section>
         <p class="identifier">bölüm</p>
         <p>deneme, deneme,deneme, deneme,deneme, deneme.</p>
      </section>
   </aside>
        <footer>
      <p class="identifier">footer</p>
      <p>Netopsiyon.com</p>
        </footer>
   </body>
</html>
En son Roi Intrépide tarafından 11 Mar 2012, 15:27 tarihinde düzenlendi, toplamda 3 kere düzenlendi.
Sebep: HTML5 derslerinde gerçekten dersler yayınlanacak. + Kod örneğinde dil tanımlaması yok. Kod örneği ekleyecekseniz w3c uyumlu olsun.Sonunda iki tane </body> </html> vardı.
Netopsiyon.com Geri Döndü!

Lütfen Forum Kurallarımızı Okuyunuz!

Dön HTML5 Kod Örnekleri

Kimler çevrimiçi

Bu forumu gezen kullanıcılar: Hiç bir kayıtlı kullanıcı yok ve 1 misafir