Kayıtlar

HTML Dersleri etiketine sahip yayınlar gösteriliyor

HTML Yorumlar

Resim
« Önceki Ders Sonraki Ders » HTML Yorum Etiketleri HTML belgelerine yorum eklemek için <!-- ve --> yorum etiketleri kullanılır. Aşağıdaki örnek HTML belgesine ekleyebileceğiniz bir yorumu, açıklamayı temsil ediyor. <!-- Açıklamanızı yorum etiketleri arasına yazın --> Not: Yorum etiketlerinin açılış etiketinde ünlem işareti ( ! ) vardır, ama kapanış etiketinde yoktur. Yorumlar tarayıcılar tarafından görüntülenmezler ama özellikle fazla kaynak kodu olan HTML belgeleri için, belgenin ilgili kısımlarına notlar ya da açıklamalar eklemek oldukça faydalıdır. İleride kaynak kodlarınız üzerinde yeni düzenlemeler yapmak istediğinizde HTML yorumları düzenleme yapılacak alana kolayca ulaşabilmenize yardımcı olur. HTML Yorumları ile bildirim ve hatırlatıcılar ekleyebilirsiniz. Örnek <!-- Hakkımda sayfası içeriği --> <p>Bir paragraf.....</p> <!-- Buraya daha fazla bilgi girmeyi unutma! --> Ke

HTML Bilgisayar Kodları

« Önceki Ders Sonraki Ders » Bir bilgisayar kodu öğesi <code> var x = 4; var y = 7; document.getElementById("demo").innerHTML = x + y; </code> HTML Bilgisayar Kodlarını Biçimlendirme HTML belgeleri normalde değişken harf boyutu ve aralığı kullanır. Fakat bilgisayar kodu örnekleri gibi öğelerin görüntülenmesinde bu tercih edilmez. Görsel olarak farkedilebilmeleri ve arama motorlarına bu örneklerin ne olduğunun bildirilebilmeleri için, varsayılan metin boyutu, stili ve karakter aralığından farklı olmaları gerekir. Bu yüzden <kbd> , <samp> ve <code> gibi bilgisayar kodu örnekleri sabit karakter boyutu ve aralığındadır. Klavye Girişi için HTML <kbd> Etiketi HTML <kbd> etiketi klavye girişini tanımlar. Örnek <p><kbd>Dosya | Aç...</kbd></p> Sonuç: Dosya | Aç... Kendiniz deneyin » Bilgisayar Çıktısı için HTML <samp> Etiketi H

HTML Alıntı ve Kaynak Elementleri

« Önceki Ders Sonraki Ders » Alıntı Mevlana'dan bir alıntı: Bencillik göze takılan ayna gibidir. O gözler nereye bakarsa baksın kendinden başka birini görmez. Kısa alıntılar için <q> Etiketi HTML <q> etiketi kısa alıntıyı tanımlar. Tarayıcılar <q> etiketi içerisine girilen metni tırnak işareti içerisine alır. Örnek <p>Harlan Coben'in Kapan adlı eserinden: <q>Gün geçmiş ve daha çok şey öğrenmiş olsak da, aynı hataları tekrarlamak insanların dna'larında var.</q></p> Kendiniz deneyin » Uzun alıntılar için <blockquote> Etiketi HTML <blockquote> etiketi alıntılanmış kısmı tanımlar ve uzun alıntılar için kullanılır. Tarayıcılar <blockquote> öğelerini girintileyerek gösterir. Örnek <p>UNICEF internet sitesinden bir alıntı:</p> <blockquote> Birleşmiş Milletler Çocuk Fonu UNICEF, dünyada çocuk haklarının başlıca savunucusudur. Hük

HTML Giriş

Resim
« Önceki Ders Sonraki Ders » HTML Nedir? HTML internet sayfalarını tanımlamaya yarayan bir işaretleme dilidir. HTML 'nin açılımı H yper T ext M arkup L anguage, yani Hiper Metin İşaretleme Dili'dir. İşaretleme dilleri bir dizi işaretleme etiketinden oluşur. HTML belgeleri, HTML Etiketleri kullanılarak tanımlanırlar. Her bir HTML etiketi farklı bir belge içeriğini tanımlar. HTML etiketleri açılı parantezler arasında yer alır. HTML Örneği Basit bir HTML belgesi: <!DOCTYPE HTML> <html> <head>   <title>Belge Başlığı</title> </head> <body>   <h1>İçerik Başlığım</h1>   <p>İlk paragrafım.....</p> </body> </html> Kendiniz deneyin » "Kendiniz deneyin" butonunu kullanarak nasıl çalıştığını görün. Yukarıda örneğini verdiğimiz HTML belgesinin öğelerini inceleyelim DOCTYPE Bildirimi belgenin HTML olması için belge türünü tanımlar. &

HTML Metin Biçimlendirme Etiketleri

Resim
« Önceki Ders Sonraki Ders » Metin Biçimlendirme Örnek <p>Bu bir <b>kalın</b> metin</p> <p>Bu bir <i>italik</i> metin</p> <p>Bu bir <em>vurgulanmış italik</em> metin</p> <p>Bu bir <small>daha küçük puntolu</small> metin</p> <p>Bu bir <strong>önemli</strong> metin</p> <p>Bu bir <sub>altsimge</sub> metni</p> <p>Bu bir <sup>üstsimge</sup> metni</p> <p>Bu bir <ins>yeni eklenmiş</ins> metin</p> <p>Bu bir <del>içerikten silinmiş, çıkarılmış</del> metin</p> <p>Bu bir <mark>öne çıkarılmış</mark> metin</p> Kendiniz deneyin » HTML Biçimlendirme Elementleri Bir önceki derste HTML style özelliği kullanarak HTML stil atama hakkında bilgi sahibi olduk. HTML özel anlam

HTML Paragraflar

Resim
« Önceki Ders Sonraki Ders » HTML Paragrafları HTML <p> elementi bir paragrafı tanımlar. Tarayıcılar her bir paragraftan önce ve sonra otomatik olarak bir satır boşluk eklerler. Örnek <p>Bu bir paragraf.....</p> <p>Bu da diğer paragraf.....</p> Kendiniz deneyin » HTML Belge Görüntülemesi HTML belgelerinin nasıl görüntüleneceklerini kestiremeyebilirsiniz. Büyük ya da küçük ekranlar veya ölçeklendirilmiş pencereler farklı görüntüleme sonuçları ortaya çıkarabilir. HTML belgesi içerisinde ekstra boşluklar ya da satırlar ekleyerek tarayıcıda görüntülenecek çıktıyı değiştiremezsiniz. Tarayıcı fazladan boşlukları ve boş satırları sayfa gösterilirken görmezden gelecektir. HTML belgesi içerisinde oluşturulacak her boşluk ve satır atlama sadece tek bir boşluk olarak görüntülenecektir. Örnek <p> Bu paragraf kaynak kodunda birkaç satır içeriyor, ama tarayıcı bunu gözardı ediyor. </p> <p> Bu paragraf k

HTML Başlıklar

« Önceki Ders Sonraki Ders » HTML Başlık Etiketleri HTML belgelerinde başlıklar önemlidir. Belge başlıkları <h1> den <h6> ya kadar olan başlık etiketleriyle tanımlanır. <h1> en önemli başlığı, <h6> ise en az önemli olan başlığı ifade eder. Not: Tarayıcılar başlıklardan önce ve sonra otomatik olarak biraz boşluk bırakırlar. Örnek <h1>HTML Başlık Etiketleri</h1> <h2>HTML Başlık Etiketleri</h2> <h3>HTML Başlık Etiketleri</h3> <h4>HTML Başlık Etiketleri</h4> <h5>HTML Başlık Etiketleri</h5> <h6>HTML Başlık Etiketleri</h6> Kendiniz deneyin » HTML başlıklarını sadece başlık olarak kullanın. Metni büyük veya kalın yazmak için başlık etiketlerini kullanmayın. Arama motorları web sayfalarınızın yapısını ve içeriğini indekslemek için içerik başlıklarınızı kullanır. Kullanıcılar ise sayfalarınızı başlıklarınıza bakarak gözden geçirirler. Bu yüzden belge yapısını gösterme

HTML Stiller

Resim
« Önceki Ders Sonraki Ders » Kırmızı renkli paragraf... Yeşil renkli paragraf... Mavi renkli paragraf... Kendiniz deneyin » HTML Stil Verme HTML elementlerine style özelliği ile stil atayabiliriz. Her HTML etiketinin varsayılan, ön-ayarlı bir stili vardır.(Arkaplan renginin beyaz, yazı renginin siyah olması gibi) Bir HTML elementinin varsayılan stilini değiştirmek için " style " özelliğini kullanırız. Aşağıdaki örnekte varsayılan arkaplan rengini beyazdan kırmızıya, varsayılan metin rengini ise siyahtan beyaza değiştireceğiz: Örnek <body style="background-color:red">   <h1 style="color:white">Bu bir başlık</h1>   <p style="color:white">Bu bir paragraf.....</p> </body> Kendiniz deneyin » background-color özelliği HTML eski versiyonlarında destekleniyor, ancak HTML5'te geçerli değil. HTML Style Özelliği HTML Style Özelliği aşağıdaki ke

HTML Özellikler

« Önceki Ders Sonraki Ders » Özellikler HTML elementleri hakkında ek bilgi verirler. HTML elementleri özellikler içerebilir. Özellikler bir element hakkında ek bilgi sağlarlar. Özellikler her zaman başlangıç etiketi içerisinde belirtilirler. Özellikler, özelliğin isim/değer çiftleri ile belirtilirler: isim="değer" lang Özelliği HTML belgesinin dili <html> etiketi içerisinde belirtilebilir. Belge dili lang özelliği ile bildirilir. Bir belgenin dil bildirimi ekran okuyucuları gibi erişilebilirlik uygulamaları ve arama motorları için önemlidir. Örnek Dil bildirimi Türkçe olan bir HTML belgesi: <!DOCTYPE html> <html lang="tr"> <body>   <h1>İlk Başlığım</h1>   <p>İlk paragrafım......</p> </body> </html> title Özelliği HTML paragrafları <p> etiketiyle belirtilir. Aşağıdaki örnekte <p> elementi title özelliğine sahip. İlgili paragraf için bir başlık