mirror of
https://github.com/adambard/learnxinyminutes-docs.git
synced 2024-12-24 10:01:38 +00:00
Düzeltmeler yapıldı
This commit is contained in:
parent
5aec515521
commit
9e22bbdf1a
@ -5,31 +5,29 @@ contributors:
|
|||||||
- ["Christophe THOMAS", "https://github.com/WinChris"]
|
- ["Christophe THOMAS", "https://github.com/WinChris"]
|
||||||
translators:
|
translators:
|
||||||
- ["Kemal MUTLU", "https://github.com/kemtake"]
|
- ["Kemal MUTLU", "https://github.com/kemtake"]
|
||||||
|
- ["Nuri Akman", "https://github.com/vedia"]
|
||||||
---
|
---
|
||||||
|
|
||||||
HTML, HyperText Markup Language(Hiper Metin İşaretleme Dili) anlamına gelir.
|
HTML, HyperText Markup Language (Hiper Metin İşaretleme Dili) anlamına gelir.
|
||||||
|
|
||||||
HTML dünya çapında web için sayfalar yazmamızı sağlayan bir dildir.
|
Web sayfaları yazmamızı sağlayan bir dildir. Bu işaretleme dili, metin ve verilerin nasıl gösterilmesi gerektiği kodlanarak web sayfaları yazmamızı sağlar. Aslında, html dosyaları basit metin dosyalarıdır.
|
||||||
It is a markup language, it enables us to write webpages using code to indicate
|
|
||||||
how text and data should be displayed. In fact, html files are simple text
|
|
||||||
files.
|
|
||||||
|
|
||||||
Bu işaretleme nedir? Sayfanın verilerini, açılış etiketleri ve kapanış etiketleri ile çevreleyerek düzenleme yöntemidir. Bu işaretleme, içerdiği metne önem vermeyi sağlar. Diğer bilgisayar dillerinde olduğu gibi, HTML’nin birçok sürümü vardır. Burada HTML5 hakkında konuşacağız.Bu işaret nedir? Sayfanın verilerini, açılış etiketleri ve kapanış etiketleri ile çevreleyerek düzenleme yöntemidir. Bu işaretleme, içerdiği metne önem vermeyi sağlar. Diğer bilgisayar dillerinde olduğu gibi, HTML’nin birçok sürümü vardır. Burada HTML5 hakkında konuşacağız.
|
Bu işaretleme nedir? Sayfanın verilerini, açılış etiketleri ve kapanış etiketleri ile çevreleyerek düzenleme yöntemidir. Bu işaretleme, içerdiği metne anlam vermeyi sağlar. Diğer bilgisayar dillerinde olduğu gibi, HTML’nin birçok sürümü vardır. Burada HTML5 hakkında konuşacağız.
|
||||||
|
|
||||||
**NOT :** Etkilerini görmek, nasıl çalıştıklarını anlamak ve dil ile ilgili bilgi edinmek için kodeken gibi bir sitedeki öğretici boyunca ilerledikçe farklı etiketleri ve öğeleri test edebilirsiniz. Bu makale temel olarak HTML sözdizimi ve bazı yararlı ipuçlarıyla ilgilidir.
|
**NOT :** Etkilerin nasıl çalıştıklarını anlamak, çıktılarını görebilmek için [codepen](https://codepen.io/) gibi bir siteden de faydalanabilirsiniz. Bu makale temel olarak HTML sözdizimi ve bazı yararlı ipuçlarıyla ilgilidir.
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<!-- Yorumlar bu çizgi gibi eklenir! -->
|
<!-- Yorumlar bu satır gibi eklenir! -->
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
Yorumlar
|
Yorumlar
|
||||||
birden
|
birden
|
||||||
fazla
|
fazla
|
||||||
satıra
|
satıra
|
||||||
yayılabilir!
|
yayılabilir!
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<!-- #################### Etiketler #################### -->
|
<!-- #################### Başlık #################### -->
|
||||||
|
|
||||||
<!-- İşte, analiz edeceğimiz örnek bir HTML dosyası. -->
|
<!-- İşte, analiz edeceğimiz örnek bir HTML dosyası. -->
|
||||||
|
|
||||||
@ -44,10 +42,10 @@ Bu işaretleme nedir? Sayfanın verilerini, açılış etiketleri ve kapanış e
|
|||||||
<a href="http://codepen.io/anon/pen/xwjLbZ">
|
<a href="http://codepen.io/anon/pen/xwjLbZ">
|
||||||
Bunun ne olduğuna bir bak.
|
Bunun ne olduğuna bir bak.
|
||||||
</a>
|
</a>
|
||||||
<p> Bu bir paragraftır.</p>
|
<p>Bu bir paragraftır.</p>
|
||||||
<p> Bu başka bir paragraf. </p>
|
<p>Bu başka bir paragraf.</p>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Bu, numaralandırılmamış bir listede bulunan bir maddedir (madde listesi)</li>
|
<li>Bu, numaralandırılmamış bir listede bulunan bir öğe/maddedir (madde imi)</li>
|
||||||
<li>Bu başka bir öğe</li>
|
<li>Bu başka bir öğe</li>
|
||||||
<li>Ve bu listedeki son öğe </li>
|
<li>Ve bu listedeki son öğe </li>
|
||||||
</ul>
|
</ul>
|
||||||
@ -55,7 +53,7 @@ Bu işaretleme nedir? Sayfanın verilerini, açılış etiketleri ve kapanış e
|
|||||||
</html>
|
</html>
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
Bir HTML dosyası , tarayıcıya her zaman sayfanın HTML olduğunu belirterek başlar.
|
Bir HTML dosyası, tarayıcıya her zaman sayfanın HTML olduğunu belirterek başlar.
|
||||||
-->
|
-->
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
|
|
||||||
@ -65,33 +63,28 @@ Bir HTML dosyası , tarayıcıya her zaman sayfanın HTML olduğunu belirterek b
|
|||||||
<!-- dosyanın sonu </html> etiketi ile kapatılır. -->
|
<!-- dosyanın sonu </html> etiketi ile kapatılır. -->
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
<!-- Bu son etiketten sonra hiçbir şey görünmemelidir. -->
|
<!-- Sayfada, bu son etiketten sonra hiçbir şey bulunmamalıdır. -->
|
||||||
|
|
||||||
<!--Açılış ve kapanış etiketleri arasında (<html> </html>) şunları buluruz: -->
|
<!-- Açılış ve kapanış etiketleri arasında (<html> </html>) şunları bulunur: -->
|
||||||
|
|
||||||
<!-- <head> tarafından tanımlanan bir başlık (bu, </head> ile kapatılmalıdır). -->
|
<!-- <head> ile tanımlanan bir sayfa başlığu (bu, </head> ile kapatılmalıdır). -->
|
||||||
<!--
|
<!-- Baslik, gösterilmeyen bazi aciklamalar ve ek bilgiler icerir; buna üstveri denir. -->
|
||||||
Baslik, gösterilmeyen bazi aciklamalar ve ek bilgiler icerir; bu üstveridir.
|
|
||||||
-->
|
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<!--
|
<!-- <title> etiketi, tarayıcıda gösterilecek başlığı gösterir. Pencerenin başlık çubuğu ve sekme adı.-->
|
||||||
<title> etiketi, tarayıcıya tarayıcıda gösterilecek başlığı gösterir
|
|
||||||
pencerenin başlık çubuğu ve sekme adı.
|
|
||||||
-->
|
|
||||||
<title>Benim Sitem</title>
|
<title>Benim Sitem</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<!-- <head> bölümünden sonra, <body> etiketi gelir. -->
|
<!-- <head> bölümünden sonra, <body> etiketi gelir. -->
|
||||||
<!-- Bu noktaya kadar, tarif edilen hiçbir şey tarayıcı penceresinde görünmeyecektir. -->
|
<!-- Bu noktaya kadar, tarif edilen hiçbir şey tarayıcı penceresinde görünmez. -->
|
||||||
<!-- <body> etiketinden sonra görüntülenecek içerikle doldurulmalı. -->
|
<!-- <body> etiketinden sonra görüntülenecek içeriğe yer verilir. -->
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<!-- h1 etiketi bir başlık oluşturur. -->
|
<!-- h1 etiketi bir başlık oluşturur. -->
|
||||||
<h1>Merhaba Dünya!</h1>
|
<h1>Merhaba Dünya!</h1>
|
||||||
<!--
|
<!--
|
||||||
Ayrıca başlıklar <h1> etiketinden <h6> etiketine kadar gidebilir.<h1> etiketi
|
Ayrıca başlıklar <h1> etiketinden <h6> etiketine kadar gidebilir.
|
||||||
en büyük <h6> etiketi en küçük başlığı yazmamızı sağlar.
|
<h1> etiketi en önemli, <h6> etiketi en düşük öncelikli başlığı yazmamızı sağlar.
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<!-- href="" özniteliğine verilen URL'ye bir köprü oluşturur. -->
|
<!-- href="" özniteliğine verilen URL'ye bir köprü oluşturur. -->
|
||||||
@ -105,12 +98,11 @@ pencerenin başlık çubuğu ve sekme adı.
|
|||||||
|
|
||||||
<!-- <ul> etiketi bir madde imi listesi oluşturur. -->
|
<!-- <ul> etiketi bir madde imi listesi oluşturur. -->
|
||||||
<!--
|
<!--
|
||||||
Numaralandırılmış bir listeye sahip olmak için <ol> etiketini kullanabiliriz.
|
Numaralandırılmış bir listeye sahip olmak için <ol> etiketi de kullanılabilir. Bu durumda 1. madde 2. madde vb. şekilde gider.
|
||||||
1. madde 2. madde vb. şekilde gider.
|
|
||||||
-->
|
-->
|
||||||
<ul>
|
<ul>
|
||||||
<li>Bu, numaralandırılmamış bir listede bulunan bir maddedir (madde listesi)</li>
|
<li>Bu, numaralandırılmamış bir bir liste kalemidir (madde imi)</li>
|
||||||
<li> Bu başka bir öğe</li>
|
<li>Bu başka bir öğe</li>
|
||||||
<li>Ve bu listedeki son öğe</li>
|
<li>Ve bu listedeki son öğe</li>
|
||||||
</ul>
|
</ul>
|
||||||
</body>
|
</body>
|
||||||
@ -121,34 +113,32 @@ pencerenin başlık çubuğu ve sekme adı.
|
|||||||
|
|
||||||
<!-- <img /> etiketi bir resim eklemek için kullanılır. -->
|
<!-- <img /> etiketi bir resim eklemek için kullanılır. -->
|
||||||
<!--
|
<!--
|
||||||
Resmin kaynağı src = "" özniteliği kullanılarak belirtilir.
|
Resmin kaynağı, src = "" özniteliği kullanılarak belirtilir.
|
||||||
Kaynak, bir URL veya bilgisayarınızdaki bir dosyanın yolu olabilir.
|
Kaynak, bir URL veya bilgisayarınızdaki bir dosyanın yolu olabilir.
|
||||||
-->
|
-->
|
||||||
<img src="http://i.imgur.com/XWG0O.gif"/>
|
<img src="http://i.imgur.com/XWG0O.gif"/>
|
||||||
|
|
||||||
<!-- Tablo oluşturmak da mümkündür. -->
|
<!-- HTML'de bir Tablo oluşturmak da mümkündür. -->
|
||||||
|
|
||||||
<!-- Bir <table> elemanı açarız. -->
|
<!-- Bir <table> elemanı açarız. -->
|
||||||
<table>
|
<table>
|
||||||
|
|
||||||
<!-- <tr> bir satır oluşturmamızı sağlar. -->
|
<!-- <tr> bir satır oluşturmamızı sağlar. -->
|
||||||
<tr>
|
<tr>
|
||||||
|
|
||||||
<!-- <th> tablo sütununa bir başlık vermemize izin verir. -->
|
<!-- <th> tablo sütununa bir başlık vermemize izin verir. -->
|
||||||
<th>Birinci Başlık</th>
|
<th>Birinci Başlık</th>
|
||||||
<th>İkinci Başlık</th>
|
<th>İkinci Başlık</th>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
||||||
<tr>
|
<tr>
|
||||||
|
|
||||||
<!-- <td> bir tablo hücresi oluşturmamızı sağlar. -->
|
<!-- <td> bir tablo hücresi oluşturmamızı sağlar. -->
|
||||||
<td>ilk satır, ilk sütun</td>
|
<td>ilk satırın, ilk hücresi (sutunu)</td>
|
||||||
<td>ilk satır, ikinci sütun</td>
|
<td>ilk satırın, ikinci hücresi (sutunu)</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
||||||
<tr>
|
<tr>
|
||||||
<td>ikinci satır, ilk sütun </td>
|
<td>ikinci satırın, ilk hücresi (sutunu) </td>
|
||||||
<td>ikinci satır, ikinci sütun</td>
|
<td>ikinci satırın, ikinci hücresi (sutunu)</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
@ -156,9 +146,10 @@ Kaynak, bir URL veya bilgisayarınızdaki bir dosyanın yolu olabilir.
|
|||||||
|
|
||||||
## Kullanım
|
## Kullanım
|
||||||
|
|
||||||
HTML, .html veya .htm ile biten dosyalara yazılır. Mim türü text/html .
|
HTML içeriği, .html veya .htm ile biten dosyalara yazılır. Mim türü text/html .
|
||||||
|
HTML olarak yazılmış dosyalar, `.html` veya `.htm` dosya uzantısına sahiptirler. mime type'ı ise `text/html` dir.
|
||||||
|
|
||||||
## Daha fazla öğrenmek için
|
## Daha fazla bilgi için
|
||||||
|
|
||||||
* [wikipedia](https://en.wikipedia.org/wiki/HTML)
|
* [wikipedia](https://en.wikipedia.org/wiki/HTML)
|
||||||
* [HTML tutorial](https://developer.mozilla.org/en-US/docs/Web/HTML)
|
* [HTML tutorial](https://developer.mozilla.org/en-US/docs/Web/HTML)
|
||||||
|
Loading…
Reference in New Issue
Block a user