Frontend Development #2
İlk Yazımda HTML’in temelde ne olduğundan ve “Tag” kelimesinden bahsetmiştim. İkinci yazımda sık kullanılan bazı tag’ların ne işe yaradıklarından kısaca bahsedeceğim.
<html> : web sayfasının içerisindeki tüm alanları kapsayan tag.
<head> : sayfa ile ilgili bilgilerin ve öncesinde çalışmasını istediğimiz kodların eklendiği bölüm.
<body> : Sayfadaki elementlerin bulunduğu, yani tasarıma ait tüm kodların bulunduğu bölüm.
<h1>..<h6>: sayfaya bu tag’ların içerisinde büyük ve kalın yazılar ekleyebiliriz. İngilizcede başlık anlamına gelen ‘Hood’ kelimesinin ilk harfidir.
<title> : bir web sayfasına başlık eklemek için kullanılır.
<i> : Bir yazının eğik hale gelmesini sağlar. İngilizcede eğik yazı anlamına gelen ‘İtalic’ kelimesinin ilk harfidir.
<em> : bir yazının eğik hale gelmesini sağlar.(daha yeni, önerilir). İngilizcede vurgulamak anlamına gelen ‘Emphasize’ kelimesinin ilk iki harfidir.
<b> : Bir yazının kalın hale gelmesini sağlıyor. İngilizcede kalın anlamına gelen ‘Bold’ kelimesinin ilk harfidir.
<strong> : bir yazının kalın hale gelmesini sağlıyor.(daha yeni, önerilir)
<br> : Kapatılması ZORUNLU DEĞİLDİR. 1 satır boşluk bırakır. İngilizcede bölmek anlamına gelen ‘Break’ kelimesinin ilk iki harfidir.
<hr> : Kapatılması ZORUNLU DEĞİLDİR. Yatay bir çizgi oluşturur. İngilizcede yatay cetvel anlamına gelen ‘Horizontel Rule’ kelimelerinin ilk harfleridir.
<p> : Pazılan yazının yeni bir paragraf olarak algılanmasını sağlar. İngilizce paragraf anlamına gelen ‘Paragraph’ kelimesinin ilk harfidir.
<ul> : Sıralı olmayan liste, nokta şeklinde liste.. İngilizcede düzensiz liste anlamına gelen ‘Unordered list’ Kelimelerinin ilk harfleridir.
<li> : Listedeki her elemanı bu tag içerisine ekleriz. İngilizcede liste öğesi anlamına gelen ‘list item’ kelimelerinin ilk harfledir.
<ol> : Sıralı liste; 1. , 2. , 3. gibi sayılar verir. İngilizcede sıralı liste anlamına gelen ‘ordered list’ kelimelerinin ilk harfleridir.
<u> : Bir yazının altını çizmek için kullanılır. İngilizcede altını çizmek anlamına gelen ‘Underline’ kelimesinin ilk harfidir.
<a> : Yazıya link vermek için kullanıyoruz. (href attribute’u ile..) İngilizcede çapa anlamına gelen ‘Anchor’ kelimesinin ilk harfidir.
***** href olmak zorunda !!!!!
<img> : resim eklemek için kullanıyoruz.(src attribute’u ile..)
***** src olmak zorunda !!!!!
***** img elementini kapatmak(</img>) zorunda değiliz.
Burda belirttiğim Tag’lar sıkça karşılacağımız taglar olup, bunun dışında fazlasıyla tag bulunmaktadır. Bununla alakalı daha fazlasını öğrenmek isteyenler “ https://www.w3schools.com/ “ adresini ziyaret edebilirler.
Bunlar dışında yazımı tablo tag’ı ile tamamlayacağım. Bu tag’ı ayrı yazmamın sebebi, diğerlerine nazaran seyrek karşılaşacağımız tag’lar olsada diğerlerine göre karışık olmalarıdır.
<table> : tablo oluşturmak için kullanılır. içerisinde <thead> ve <tbody> diye iki bölüm olabilir. (olmak zorunda değil.)
<thead> : tablonun içerisindeki sütunların başlıklarının eklendiği bölüm.
<tbody> : tablonun verilerinin eklendiği, içerisinde satırların bulunduğu bölüm.
<tr> : tablonun içerisine eklenen hücrelerin bulunduğu satır. satır oluşturmak için kullanırız.
<td> : tr’nin içerisine (tbody’nin içindeki) hücre eklemek için kullanılır.
<th> : tr’nin içerisine (thead’in içindeki) hücre eklemek için kullanılır.
<table>
<tbody>
<tr><td>Başlık 1</td> <td>Başlık 2</td> </tr>
<tr><td>1. Hücre</td> <td>2. Hücre</td> </tr>
<tr><td>1. Hücre</td> <td>2. Hücre</td> </tr>
<tr><td>1. Hücre</td> <td>2. Hücre</td> </tr>
</tbody>
</table>
