Etiket: html

HTML <table> Tag

Örnek

<table>
  <tr>
    <th>Ay</th>
    <th>Gider</th>
  </tr>
  <tr>
    <td>Ocak</td>
    <td>50 TL</td>
  </tr>
</table>

Bu etiket  tablo tanımlamak için kullanılır.<tr> etiketi satır,  <th> etiketi tablo başlığı ve <td> etiketi de tablo hücresi tanımlamak için kullanılır.

Codepen Ön izleme

 

<table>
  <tr>
    <th>Ay</th>
    <th>Gider</th>
  </tr>
  <tr>
    <td>Ocak</td>
    <td>50 TL</td>
  </tr>
</table>

See the Pen HTML table tag by W3TR (@w3tr) on CodePen.

Nitelikler

Nitelik Değer Açıklama
align left
center
right		 HTML5 tarafından desteklenmiyorÇevredeki metne göre içeriğin nasıl hizalanacağını belirtmek için kullanılır.
bgcolor rgb(x,x,x)
#xxxxxx
colorname		 HTML5 tarafından desteklenmiyorTablo arka plan rengini belirtmek için kullanılır.
border 1
0		 HTML5 tarafından desteklenmiyorTablo hücre sınırlarını belirtmek için kullanılır.
cellpadding pixels HTML5 tarafından desteklenmiyorHücre duvarı ve hücre içeriği arasındaki boşluğu belirtmek için kullanılır.
cellspacing pixels HTML5 tarafından desteklenmiyorHücreler arasındaki boşluğu belirtmek için kullanılır.
frame void
above
below
hsides
lhs
rhs
vsides
box
border		 HTML5 tarafından desteklenmiyorDış sınırların parçalarının görünür olması gerektiğini belirtmek için kullanılır.
rules none
groups
rows
cols
all		 HTML5 tarafından desteklenmiyoriç sınırların parçalarının görünür olması gerektiğini belirtmek için kullanılır.
sortable sortable Tablo sınırlanabilir olduğunu belirtmek için kullanılır.
summary text HTML5 tarafından desteklenmiyorTablo içeriğinin bir özetini belirtmek için kullanılır.
width pixels
%		 Tablo genişliğini belirtmek için kullanılır.
Posted on by Samed GÖZÜTOK 0

HTML <summary> Tag

Örnek

<details>
  <summary>Telif Hakkı - 2015</summary>
  <p> - ARAYÜZ tarafından tüm hakları saklıdır.</p>
  <p>Bu sitenin tüm içeriği ARAYÜZ şirketinin mülkiyetindedir.</p>
</details>

Bu etiket  <details> etiketinin başlığını belirtmek için kullanılır. Başlık içeriğin gösterilip/gizlenebilmesi için tıklanabilir şekildedir.

Codepen Ön izleme

 

<details>
  <summary>Telif Hakkı - 2015</summary>
  <p> - ARAYÜZ tarafından tüm hakları saklıdır.</p>
  <p>Bu sitenin tüm içeriği ARAYÜZ şirketinin mülkiyetindedir.</p>
</details>

See the Pen HTML summary tag by W3TR (@w3tr) on CodePen.

Posted on by Samed GÖZÜTOK 0

HTML <style> Tag

Örnek

<html>
<head>
<style>
h1 {color:yellow;}
p {color:green;}
</style>
</head>
<body>

<h1>Başlık</h1>
<p>Paragraf.</p>

</body>
</html>

Bu etiket  HTML belgeleri için stil bilgileri tanımlamak için kullanılır.

Codepen Ön izleme

 

<html>
<head>
<style>
h1 {color:yellow;}
p {color:green;}
</style>
</head>
<body>

<h1>Başlık</h1>
<p>Paragraf.</p>

</body>
</html>

See the Pen HTML style tag by W3TR (@w3tr) on CodePen.

Nitelikler

Nitelik Değer Açıklama
media media_query Optimize edilecek media türünü belirtmek için kullanılır.
media media_query Optimize edilecek media türünü belirtmek için kullanılır.
scoped scoped Stilleri sadece bir öğeye ve o öğenin alt öğelerine uygulanacağını belirtmek için kullanılır.
type text/css Etiketin ortam türünü belirtmek için kullanılır.
Posted on by Samed GÖZÜTOK 0

HTML <span> Tag

Örnek

<p>HTML <span style="color:red">CSS</span></p>

Bu etiket belgede satır içi grup tanımlamak için kullanılır.

Not: Bir metin <span> etiketinin arasına alındığında CSS ile biçimlendirebilir ve javascript ile hareketlendirebilirsiniz.

Codepen Ön izleme

 

<p>HTML <span style="color:red">CSS</span></p>

See the Pen HTML span tag by W3TR (@w3tr) on CodePen.

Posted on by Samed GÖZÜTOK 0

HTML <source> Tag

Örnek

<audio controls>
  <source src="http://w3tr.com/file/flut1.mp3" type="audio/mpeg">
   Tarayıcınız audio elementini desteklemiyor.
</audio>

Bu etiket <audio> ve <video> gibi  medyalar için birden fazla medya kaynağı belirtmek için kullanılır.

Codepen Ön izleme

 

<audio controls>
  <source src="http://w3tr.com/file/flut1.mp3" type="audio/mpeg">
   Tarayıcınız audio elementini desteklemiyor.
</audio>

See the Pen HTML source tag by W3TR (@w3tr) on CodePen.

Nitelikler

Nitelik Değer Açıklama
media media_query Media türünü belirtmek için kullanılır.
src URL Ortam dosyasının URL sini belirtmek için kullanılır.
type media_type Medya dosyasının türünü belirtmek için kullanılır.
Posted on by Samed GÖZÜTOK 0

HTML <select> Tag

Örnek

<select>
  <option value="HTML">HTML</option>
  <option value="CSS">CSS</option>
  <option value="JAVA">JAVA</option>
  <option value="ASP">ASP</option>
</select>

Bu etiket açılır listeler oluşturmak için kullanılır. option etiketi  içerisinde select kullanarak liste öğeleri tanımlayabilirsiniz.

Codepen Ön izleme

 

<select>
  <option value="HTML">HTML</option>
  <option value="CSS">CSS</option>
  <option value="JAVA">JAVA</option>
  <option value="ASP">ASP</option>
</select>

See the Pen HTML select tag by W3TR (@w3tr) on CodePen.

Nitelikler

Nitelik Değer Açıklama
autofocus autofocus Sayfa yüklendiğinde açılır listeye otomatik olarak odaklanacağını belirtmek için kullanılır.
disabled disabled Açılır listenin devre dışı bırakılacağını belirtmek için kullanılır.
form form_id Açılır listeye ait bir veya daha fazla form alanı tanımlamak için kullanılır.
multiple multiple Açılır listeden birden fazla seçeneğin seçilebileceğini belirtmek için kullanılır.
name name Açılır listenin ismini belirtmek için kullanılır.
required required Açılır listeden bir seçenek seçmenin zorunlu olduğunu belirtmek için kullanılır.
size number Açılır listede kaç seçeneğin görüneceğini belirtmek için kullanılır.
Posted on by Samed GÖZÜTOK 0