HTML yazarken bazen klavyemizden kolayca yazamayacağımız özel karakterlere veya HTML’nin kendisi tarafından ayrılmış karakterlere ihtiyaç duyarız. Bu gibi durumlarda HTML Entities (varlık kodları) devreye girer. Bu yazıda, HTML Entities’in ne olduğu, nasıl çalıştığı ve örnek kullanımları açıklanacaktır.
HTML Entities Nedir?
- HTML Entities, HTML belgesi içinde özel karakterleri göstermek için kullanılan özel kodlardır.
- Neden Gerekli?
- Bazı karakterler, HTML tarafından ayrılmıştır (örneğin
< ve > etiketlerde kullanılır).
- Klavyede kolayca yazılamayan semboller (örneğin,
©, →) için kullanılır.
HTML Entity Söz Dizimi
- Her HTML Entity şu şekilde yazılır:
- Başında bir
& (ampersand),
- Ardından karakterin adı veya kodu,
- Sonunda bir
; (noktalı virgül) bulunur.
Örneğin:
< karakterini göstermek için: <> karakterini göstermek için: >© sembolü için: ©
Sık Kullanılan HTML Entities
| Karakter | Entity Kodu | Entity İsmi | Sonuç |
|---|
< | < | < | < |
> | > | > | > |
& | & | & | & |
© | © | © | © |
® | ® | ® | ® |
" | " | " | " |
' | ' | ' | ' |
→ | → | → | → |
HTML Entities Kullanımı
1. Ayrılmış Karakterler
HTML’de <, >, ve & gibi karakterler özel bir anlam taşır. Bu nedenle, bu karakterleri metin içinde göstermek için entity kullanmanız gerekir:
<p>1 < 2 & 2 > 1</p>
Sonuç:
1 < 2 & 2 > 1
2. Özel Semboller
Kopyalama hakkı, ticari marka veya diğer semboller için:
<p>Tüm hakları saklıdır © 2025. Ticari marka ® sembolü.</p>
Sonuç:
Tüm hakları saklıdır © 2025. Ticari marka ® sembolü.
HTML Entities ile Sayı Kodu Kullanımı
Her HTML Entity’nin bir isimli kodu olduğu gibi bir de sayı kodu vardır. Sayı kodu genellikle şu şekilde yazılır:
Örneğin:
< yerine < yazabilirsiniz.
<p>Sayı kodu kullanımı: < > &</p>
Sonuç:
Sayı kodu kullanımı: < > &
Sık Kullanılan Senaryolar
1. Matematiksel İfadeler
<p>Matematiksel semboller: ≤ ≤, ≥ ≥</p>
Sonuç:
Matematiksel semboller: ≤, ≥
2. Şiir veya Özel Formatlar
Satır sonu gerektiren şiirler için br etiketiyle birlikte kullanabilirsiniz:
<p>
Göklerde kartallar süzülür<br>
Ufuklar sonsuz bir yol<br>
♥ ve ♠ gibi semboller<br>
</p>
Örnek Proje
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML Entities Örnekleri</title>
</head>
<body>
<h1>HTML Entities Örnekleri</h1>
<p>Ayrılmış karakterler: <, >, &</p>
<p>Özel semboller: ©, ®, ♥, →</p>
<p>Matematiksel ifadeler: 5 < 6 & 6 > 5</p>
<p>Kart sembolleri: ♠, ♥, ♦, ♣</p>
<p>Unicode karakterleri: ♠, ♥, ♦, ♣</p>
</body>
</html>
Sonuç:
- Ayrılmış karakterler, özel semboller ve matematiksel ifadeler düzgün bir şekilde gösterilir.
Sonuç
HTML Entities, özel karakterleri ve sembolleri kolayca göstermenizi sağlar. Bu kodları öğrenerek web sitelerinizde daha zengin içerikler oluşturabilirsiniz. Özel semboller veya ayrılmış karakterlere ihtiyaç duyduğunuzda, &entity; formatını kullanmayı unutmayın!