HTML Örneği
HTML temel etiket örnekleri
- Basit bir HTML dosyası
- Bu örnek, mümkün olduğunca az HTML etiketi kullanan çok basit bir HTML dosyasıdır. Body elementindeki içeriğin tarayıcı tarafından nasıl görüntüleneceğini size gösterir.
- Basit paragraf
- Bu örnek, paragraf elementindeki metnin tarayıcı tarafından nasıl görüntüleneceğini gösterir.
- Daha fazla paragraf
- Bu örnek, paragraf elementlerinin bazı öntanımlı davranışlarını gösterir.
- Şiir sorunu
- Bu örnek, HTML formatlandırma sorunlarının bazılarını gösterir.
- Satır
- Bu örnek, HTML belgesinde satırın nasıl kullanılacağını gösterir.
- Başlık
- HTML belgesinde başlıkların nasıl gösterileceğini gösterir.
- Merkezi hizada yerleştirilmiş başlık
- Bu örnekte, merkezi hizada yerleştirilmiş bir başlık gösterilir.
- Dikey çizgi
- Bu örnekte, nasıl dikey çizgi ekleyebileceğinizi gösterir.
- Gizli yorumlar
- HTML kaynak kodunda nasıl gizli yorum ekleyebileceğinizi gösterir.
- Arka plan rengi
- Bu örnekte, HTML sayfasına nasıl arka plan rengi ekleyebileceğinizi gösterir.
Örnek Açıklamalar
HTML çerçeve örneği
- Dikey çerçeve
- Bu örnekte, üç farklı belge kullanarak nasıl bir dikey çerçeve oluşturulacağını gösterir.
- Yatay çerçeve
- Bu örnekte, üç farklı belge kullanarak nasıl bir yatay çerçeve oluşturulacağını gösterir.
- <noframes> etiketinin nasıl kullanılacağı
- Bu örnekte, <noframes> etiketinin nasıl kullanılacağını gösterir.
- Karışık çerçeve yapısı
- Bu örnekte, üç belge içeren bir çerçeve yapısını nasıl oluşturacağınızı ve bunları satır ve sütunlar arasında karıştırarak nasıl yerleştireceğinizi gösterir.
- noresize="noresize" özelliğine sahip çerçeve yapısı
- Bu örnek, noresize özelliğini gösterir. Bu örnekte, çerçeve boyutlandırılamaz. Çerçeve arasındaki sınırlar üzerinde fareyi sürüklediğinizde, sınırların hareket ettirilemediğini göreceksiniz.
- Navigasyon çerçevesi
- Bu örnek, nasıl navigasyon çerçevesi oluşturulacağını gösterir. Navigasyon çerçevesi, ikinci çerçevenin hedef olarak alındığı bir bağlantı listesini içerir. "contents.htm" adlı dosya, üç bağlantı içerir.
- İç çerçeve
- İç çerçeve (HTML sayfasındaki çerçeve) nasıl oluşturulacağını gösterir.
- Çerçeve içinde belirli bir bölüme geçiş yapma
- Bu örnek, bir çerçeveye belirtilen bir dosya içindeki belirli bir bölüme yönlendiren bir bağlantı içeren iki çerçeve içerir. Bu "link.htm" dosyasında belirtilen bölümler, <a name="C10"> ile işaretlenmiştir.
- Belirtilen bölüme navigasyon çerçevesi ile geçiş yapma
-
Bu örnek, iki çerçeve içerir. Sol navigasyon çerçevesi, bir bağlantı listesi içerir ve bu bağlantılar ikinci çerçeveyi hedef olarak alır. İkinci çerçeve, bağlantılandığı belgeyi gösterir. Navigasyon çerçevesindeki bağlantılar, hedef dosya içinde belirtilen bölümlere yönlendirir.
Örnek Açıklamalar
HTML form ve giriş örnekleri
- Metin alanı (Text fields)
- Bu örnek, nasıl HTML sayfasında bir metin alanı oluşturulduğunu gösterir. Kullanıcı metin alanına metin yazabilir.
- Parola alanı
- Bu örnek, nasıl HTML'nin parola alanı oluşturulduğunu gösterir.
- Çift kutusu
- Bu örnek, nasıl HTML sayfasında bir çift kutusu oluşturulduğunu gösterir. Kullanıcı çift kutusunu seçebilir veya seçebilir.
- Seçenek düğmesi
- Bu örnek, nasıl HTML'de basit bir seçenek düğmesi oluşturulduğunu gösterir.
- Basit açılır liste
- Bu örnek, nasıl HTML sayfasında basit bir açılır liste kutusu oluşturulduğunu gösterir. Açılır liste kutusu bir seçim listesidir.
- Başka bir açılır liste
- Bu örnek, nasıl basit bir ön seçenek içeren bir açılır listesi oluşturulduğunu gösterir. (Yazarın notu: Ön seçenek, önceden belirlenen bir önceliktir.)
- Metin alanı (Textarea)
- Bu örnek, nasıl bir metin alanı (çok satırlı metin giriş kontrolü) oluşturulduğunu gösterir. Kullanıcı metin alanına metin yazabilir. Metin alanında yazılabilir karakter sayısı sınırsızdır.
- Düğme oluşturmak
- Bu örnek, nasıl düğmeler oluşturulduğunu gösterir. Düğme üzerindeki metni özelleştirebilirsiniz.
- Veri etrafında fieldset
- Bu örnek, nasıl veri etrafına başlıklı bir kutu çizildiğini gösterir.
Form örneği
- Giriş kutusu ve onay düğmesi içeren form
- Bu örnek, nasıl sayfaya form eklediğini gösterir. Bu form iki giriş kutusu ve bir onay düğmesi içerir.
- Çift kutusu içeren form
- Bu form iki çift kutusu ve bir onay düğmesi içerir.
- Seçenek düğmesi içeren form
- Bu form iki seçenek kutusu ve bir onay düğmesi içerir.
- Formdan e-posta göndermek
- Bu örnek, nasıl formdan e-posta gönderildiğini gösterir.
Örnek Açıklamalar
HTML görsel örneği
- Görsel eklemek
- Bu örnek, nasıl web sayfasında görseli gösterdiğinizi gösterir.
- Farklı konumlardan resim eklemek
- Bu örnek, nasıl farklı konumlardan resimleri web sayfasına eklediğini gösterir.
- Arka plan görseli
- Bu örnek, nasıl HTML sayfasına arka plan görseli eklediğini gösterir.
- Görselleri yerleştirmek
- Bu örnek, nasıl metin içinde görsellerin nasıl yerleştirileceğini gösterir.
- Yüklenecek görsel
- Bu örnek, nasıl paragrafın soluna veya sağına yükleneceğini gösterir.
- Görsel boyutunu ayarlamak
- Bu örnek, nasıl farklı boyutlara ayarlandığını gösterir.
- Resmin yerine metin göstermek
- Bu örnek, nasıl resmin yerine metin gösterdiğinizi gösterir. Resim yüklenemiyorsa, değiştirilmiş metin özelliği okuyuculara kaybedilen bilgileri anlatır. Sayfadaki tüm resimlere değiştirilmiş metin özelliği eklemek iyi bir alışkanlıktır.
- Resim bağlantısı yapmak
- Bu örnek, resmi bir bağlantı olarak nasıl kullandığınızı gösterir.
- Resim haritası oluşturmak
- Bu örnek, nasıl tıklanabilir alanlar içeren bir resim haritası oluşturduğunu gösterir. Her alan bir bağlantıdır.
- Resmi harita haritasına dönüştürmek
- Bu örnek, nasıl normal bir resmi harita haritası olarak ayarladığınızı gösterir.
Örnek Açıklamalar
