blog posts

Başlamanız için temel HTML öğreticisi

 

HTML öğreticisi

programlama dili makalesinin bu bölümünde, onunla çalışmaya başlamak için temel HTML eğitimi verilmektedir.

 

HTML öğesinin yapısı nedir?

HTML yapılarını kullanarak, oluşturulan sayfada görüntüleri ve etkileşimli formlar gibi diğer nesneleri kullanmak mümkündür. Aşağıda, bu makalenin önceki bölümlerinde tanıtılan paragraf öğesi (etiket) analiz edilmiş ve böylece HTML yapısı ve bileşenleri açıklanmıştır. Aşağıda, HTML öğesinin bileşenlerinin ve yapısının bir görüntüsü görüntülenir.

HTML programlama dilinde HTML öğesinin bileşenleri ve yapısı nelerdir? | Öğrenme ve başlama kılavuzu basit bir kelimeyle

Aşağıda, HTML öğesinin ana bölümleri tanıtılmaktadır.

 

HTML öğreticisi

İlk etiket

Bu etiket, iki büyük ve küçük harf işareti içine alınmış öğenin adını (bu durumda, özellikle p harfini) içerir. Başlangıç ​​etiketi, öğenin nerede başladığını veya öğenin içerik üzerindeki etkisinin nerede başladığını belirtir.

 

Bitiş etiketi

Bu etiket, öğe adından önce bir bölü (/) olması dışında başlangıç ​​etiketiyle aynıdır. Bitiş etiketi, öğenin nerede bittiğini belirtir. Bitiş etiketini kullanmayı unutmak, yeni başlayanların yaptığı ilk hatalardan biridir. Bu hata anormal sonuçlara yol açabilir.

 

içerik

Bir HTML öğesindeki iki ilk ve son etiketin içine istenen içerik yerleştirilir. Yukarıdaki resimde ve burada sunulan örnekte bu içerik yalnızca metin içermektedir.

 

HTML öğesi

Başlangıç ​​etiketi, bitiş etiketi ve bunların içindeki içerik birlikte bir HTML öğesi oluşturur. HTML öğeleri, HTML sayfalarının temelidir.

HTML özelliği

Daha önce belirtildiği gibi, HTML öğelerinin bir dizi özelliği olabilir. Örneğin, bir sıfat aşağıdaki gibidir.

HTML programlama dilinin içeriğinde bir HTML niteliğinin gösterimi nedir? | Öğrenme ve başlama kılavuzu basit bir kelimeyle

Nitelikler, çıktı içeriğinde görüntülenmesi amaçlanmayan bir öğe hakkında ek bilgiler içerir. Burada sınıf bir özniteliğin adıdır ve editör notu bu özniteliğin değeridir. class niteliği, öğeye stil (CSS) ve diğer (JavaScript) bilgileriyle bu öğeyi hedeflemek için kullanılabilen benzersiz olmayan bir tanımlayıcının atanmasına izin verir. Ayrıca, aynı sınıf değerine sahip diğer herhangi bir öğe, yani editör notu da hedeflenebilir.

 

iç içe öğeler

HTML programlama dilinde, öğeler diğer öğelerin içine yerleştirilebilir. Buna yuvalama denir. Örneğin, bir cümledeki kelimelerden birinin kalın yazı tipiyle gösterilmesi gerekiyorsa, o kelime bir <strong> etiketinin içine yerleştirilebilir. Bu, kelimenin kalın olarak gösterilmesi ve vurgulanması gerektiği anlamına gelir. Bu örnek için bir örnek kod aşağıdadır.
Bir öğenin etiketleri, yuvalanmış öğelerin içine veya dışına düzgün şekilde sığacak şekilde her zaman doğru şekilde açılıp kapatılmalıdır. Yukarıdaki örnekte önce <p> elemanı açılır ve ardından <strong> elemanının açılış etiketi yerleştirilir. Bu nedenle, önce <strong> etiketi (<strong/>) ve ancak o zaman <p> öğesi kapatılmalıdır.

Boş öğeler

HTML programlama dilindeki bazı öğelerin içeriği yoktur ve bunlara boş öğeler adı verilir. Örneğin, <img> öğesini düşünebiliriz. Aşağıda bir <img> öğesi tanımlamak için bir HTML kodu örneği verilmiştir.

 

Yukarıdaki HTML kodunda gösterildiği gibi, <img> öğesinin iki özelliği vardır, ancak öğeyi içine alacak bir bitiş etiketi yoktur. Doğal olarak, <img> öğesinin içinde içerik yoktur. Bunun nedeni, <img> öğesinin doğasının onu değiştirecek içerik içermemesidir. Bu öğenin amacı, HTML sayfasına bir resim gömmektir, bu resim, resim öğesi sayfaya eklendiği yerde görüntülenecektir.

Bir HTML sayfasının yapısı

Temel HTML öğeleri bağımsız olarak çalışmaz. Temel olarak, eksiksiz bir HTML sayfasını oluşturan HTML öğelerinin birleşimidir. HTML programlama diline giriş öğreticisinin bu bölümünde, eksiksiz bir HTML sayfası oluşturmak için HTML öğelerinin nasıl birleştirileceği sunulmaktadır. Bir HTML sayfası oluşturmak için önce istenen ada sahip bir metin dosyası oluşturulmalıdır. HTML kodları bu dosyanın içine yerleştirilir.

Bir HTML sayfası oluşturmak için Not Defteri gibi basit bir metin düzenleyici kullanılabilir. Bir metin dosyasını HTML biçimine dönüştürmek için uzantısını “html” olarak eklemelisiniz. Değişti. Örneğin bir HTML sayfasının yapısını görüntülemek için oluşturulan dosyaya aşağıdaki kodların kopyalanması gerekir.

 

<DOCTYPE html!> : Doctype etiketi zorunlu bir önsözdür. HTML’nin genç olduğu zamanlarda (1970 dolaylarında), bir HTML sayfasının iyi HTML olarak kabul edilmesi için izlemesi gereken bir dizi kuralı iletmek için doktipler kullanıldı. Bu, otomatik hata kontrolü ve diğer pratik şeyler anlamına geliyordu. Ancak bugün, doktipler fazla bir şey yapmıyor ve yalnızca HTML belgesinin doğru şekilde davranmasını sağlamak için kullanılıyor. Başlangıç ​​seviyesinde, doctype hakkında bilgi yeterlidir.

<html></html>: <html> öğesi, bir sayfanın tüm içeriğini kapsar ve bazen kök öğe olarak bilinir.

<head></head>: <head> öğesi, içeriği HTML sayfası ziyaretçilerine gösterilmesi amaçlanmayan tüm öğeler için bir kapsayıcı olarak kullanılır. Bu öğeler, anahtar kelimeler, arama sonuçlarında görünecek sayfa açıklamaları, içerik tasarlamak için CSS kodları, karakter kümesi tanımları ve daha fazlasını içerir.

<meta charset=”utf-8”>: Bu öğe, karşılık gelen belgenin kullanması gereken Karakter Kümesini UTF-8 olarak ayarlar. UTF-8, çok sayıda yazılı dilde çoğu karakteri içerir. Bu sayede, HTML sayfasında kullanılmak üzere her türlü metin içeriğini yönetmek ve düzenlemek mutlaka mümkündür. Gelecekte bazı sorunları önleyebileceği için karakter setini ayarlamamak için hiçbir neden yoktur.

<title></title>: Adından da anlaşılacağı gibi <title> öğesi, HTML sayfasının başlığını ayarlamak ve belirlemek için kullanılır. Bu başlık, sayfanın yüklendiği tarayıcının sekmesinde görünür. Ayrıca, bu başlık sayfa işaretlendiğinde kullanılır. Bir sayfaya yer işareti koymak, onu tarayıcının sık kullanılanlar listesine yerleştirmek anlamına gelir.

<body></body>: <body> öğesi, ilgili sayfayı ziyaret ettiklerinde web kullanıcılarına gösterilecek tüm içeriği içerir. Bu içeriğin metin, resim, video, oyun, oynanabilir ses parçaları veya başka bir şey olup olmadığı.