1. Ayyıldız Tim forumu Hariç Hiç Bir şekilde Rütbeli Oldugunu İdda edenlere inanmayınız.. Ayyıldız Tim Adına Sizden Bilgi Belge TC Kimlik Vb Evrak İsteyenlere Asla Bilgilerinizi Vermeyiniz.
    Duyuruyu Kapat

Html Eğitim Seti

'Html - CSS - XML - JavaScript - Ajax' forumunda dangerousvirus tarafından 2 Kasım 2018 tarihinde açılan konu

    • Guest
    Katılım:
    1 Kasım 2018
    Mesaj:
    3
    Alınan Beğeniler:
    4

    Özel Mesaj
    HTML Nedir?
    • HTML'in açılımı Hyper Text Markup Language.
    • HTML dosyası bir text dosyası olmakla işaretlenme etiketleri vardır. (programlama dili değildir).
    • HTML dosyasının uzantısı .html ve ya .htm olmalıdır.
    • HTML herhangi bir editör ya da bir not defteri ile yazılabilir (visual studio, notepad++, sublime text...).

    HTML İskeleti ve Görevleri
    <html>
    <head>
    <title>Başlık yazılacak yer</title>
    </head>
    <body>
    Web sitemizin yayınlanacak kısmı
    </body>
    </html>

    <html> HTML dökümanını belirtir.
    <head> Web sayfası ile ilgili temel özellikler, sayfa başlığı, yazı karakterler kümesi, link özellikleri burada tanımlanır
    <title> Sayfamızın başlığını bu kısma yazıyoruz.
    <body> Sayfamızın yayınlanacağı kısım burası.

    HTML Temel Etiketler

    <h1>...</h1> 24 px yazar.
    <h2>...</h2> 22 px yazar.
    <h3>...</h3> 18 px yazar.
    <h4>...</h4> 16 px yazar.
    <h5>...</h5> 12 px yazar.
    <h6>...</h6> 10 px yazar.
    (başlık etiketi diye geçer)

    Yorum Satırı Oluşturma
    <!--Kodu etkilemeyecek-->
    • metni paragraf yazmak için <p>...</p> kullanabilirsiniz.
    • satır atlamak için <br> etiketi kullanabilirsiniz (<br> etiketi kullanırken etiketi kapatmayın hata oluşabilir yani </br> olmayacak).
    • yazıyı kalınlaştırmak için <b>..</b> ve ya <strong>..</strong> etiketi kullanabilirsiniz.
    • altı çizili metinler için <ins>...</ins> etiketini kullanabilirsiniz.
    • üstü çizili metinler için <del>...</del> etiketi kullanabilirsiniz
    • programlama dili metini için <code>...<code> etiketi kullanabilirsiniz.
    • klavye metini için <kbd> etiketi kullanabilirsiniz.
    • örnek bilgisayar kodu metni için <samp> etiketini kullanabilirsiniz.
    • tele tip metini için <tt> etiketini kullanabilirsiniz.
    • biçimlendirilmemiş metin için <pre> etiketi kullanabilirsiniz.
    • yazının altını çizmek için <u>...</u> etiketi kullanabilirsiniz.
    • yazıyı italik hale getirmek için <i>...</i> kullanabilirsiniz.
    • yazıyı üst simge yapmak için <sup>...</sup> kullanabilirsiniz.
    • uzun alıntılar için <blockquote> kullanabilirsiniz.
    • yazıyı alt simge yapmak için <sub>...<sub> kullanabilirsiniz.
    • Sayfaya yatay bir çizgi çekmek için <hr> etiketi kullanabilirsiniz.
    <font> Kullanıldığı yerdeki metinlerin renk, boyut, yazı tipi gibi özelliklerini değiştirmek için kullanılır. Size, color ve face parametreleri ile kullanılabilir. Bu parametrelerin üçünü de aynı anda kullanmak zorunda değiliz.
    <font faze="comic sans ms">Yazının stili değiştirilmiş</font>
    <font size="7px">Yazının büyüklüğü değiştirilmiş</font>
    <font color="red">Yazının rengi değiştirilmiş</font> ve ya <font color="#0G54IY">Yazının rengi değiştirilmiş</font>

    Metnin yerini vermek için <left>, <center>, <right> etiketini kullanabilirsiniz

    Listeleme Etiketleri
    <ol> Sıralı liste oluşturmak için kullanılır. Sıralı listelerden kastımız kelime ya da cümlelerinizi ya da herhangi bir şeyi numaralı, alfabetik, roma rakamlı olarak sıralı göstermektir.
    <ul> Listeleme yaparken maddelerin başına harf, rakam gibi unsurlar yerine küçük yuvarlaklar, kareler yerleştirmek için kullanıyoruz.
    <li> Yukarıda anlatmış olduğumuz <ol> ve <ul> etiketleri tek başına kullanılmaz sırayı belirtmek için de <li> imi ile birlikte kullanılır. Yani sıralanacak olan ifadenin başına <li> getirmeliyiz.

    Bağlantı vermek, çapa atmak, bağlantılı sayfayı açılış şeklini belirlemek.

    Mesela bir sayfaya bağlantı verdiniz a sitesinden b sitesine gitmek istiyorsunuz onun için <a href="www.ayyildiz.org>tıklanacak metin</a> kullanabilirsiniz.

    Mesela aynı sayfada aşağı ya da yukarı gitmesini istiyorsunuz asansör sistemi gibi düşünün bir tuşa bastığınızda hangi kata gideceğinizi belirler bunun için ise <a href="#iletisim">İletişim</a> tıklayacağımız yeri ayarladık <a name="iletisim"></a> gideceğimiz yeri ayarladık

    Bağladığımız siteyi ayrı sayfada ya da aynı sayfada açılması için <target> etiketini kullanıyoruz (bu sadece ayrı siteye gidecekler için iyi olur)
    target="_blank" Bağlantı yeni bir pencerede açılır.
    target="_self" Bağlantı aynı pencere içerisinde açılır.
    target="_top" Bağlantı aynı pencere içerisinde en üstten itibaren açılır.
    target="_parent" Açılan bağlantı, o anda açık sayfayı oluşturmuş bir ana sayfa varsa onun yerine konur.
    target="çerçeve adı" Frame komutu ile çerçeve oluşturulmuşsa bağlantının adı verilen çerçevede açılmasını sağlar.

    Tablo Etiketleri
    Tablo oluşturmak için bu etiket açılmak zorundadır. Tablonun düzenli gözükmesi için kullanılan parametreler vardır.(<table></table> etiketi)
    <tr> Tabloda satır oluşturmayı sağlar.
    <td> Tabloda sütun oluşturmayı sağlar.
    border Hücrelerin ve tablonun etrafındaki çerçevenin kalınlığını ayarlamak için kullanılır.
    <thead> Tablo başlığı
    <tbody> Tablo gövdesi
    caption Tablonun alt veya üst kısımlarında açıklamalar yapmak için kullanılır.
    <th> Tablo içindeki sütun başlıkları için kullanılır.
    width Tablonun pixel cinsinden genişliğini belirler. Bu parametreyi kullanmazsanız, Web tarayıcınız hücre içeriklerini görüntüleyebileceği en makul genişliği tablonuza otomatik olarak atayacaktır.
    height Tablonun pixel cinsinden yüksekliğini belirler. Bu parametreyi kullanmazsanız, Web tarayıcınız hücre içeriklerini görüntüleyebileceği en makul yüksekliği tablonuza otomatik olarak atayacaktır.
    colspan Aynı satırdaki hücreleri birleştirmek için kullanılır.
    rowspan Aynı sütundaki hücreleri birleştirmek için kullanılır.
    cellspacing Tablonun içerisindeki hücrelerin, birbirlerinden ve tablo sınırlarından uzaklığını, pixel cinsinden ayarlar.
    cellpadding Cellpadding değişkenine verilebilecek herhangi bir sayı, tablonun sınırları ile tablo içeriği arasındaki mesafeyi ayarlar.

    Form Etiketleri
    <form> Bir form oluşturmak için <form>…</form> etiketleri arasına istenilen kontroller input etiketi sayesinde belirtilir. Kontrollerden toplanan bilgilerin nasıl değerlendirileceği form etiketinin içinde gösterilir.
    <input> Genel amaçlı bir form etiketidir. Sonlandırıcı etiketi yoktur. Girdi türü type öğesinde belirtilerek farklı girdilerin alınmasını sağlar.
    <checkbox> Formumuza onay kutuları eklemek için kullanılır.
    <radio> Kullanıcının birçok seçenek içerisinden bir tanesini seçebilmesine olanak tanır.
    <text> Kullanıcıdan tek satırlık veri alınmasına olanak tanır. Size ve maxlength takıları, bu kontrolle birlikte kullanılabilir.
    <image> Bir resmi ifade eder ve üzerine tıklandığında form değerlerini sunucuya yollar.
    <password> Formumuza parola yazılabilecek alan eklemek için kullanılır.
    <textarea> Metin alanı anlamına gelen bu kelime formunuza yazı yazılabilecek alan eklemek için kullanılır.
    <reset> Tıklandığında form içeriğini temizler. Kullanıcının formu tekrar doldurmasını sağlar.
    <submit> Form içeriğini sunucuya yollar.

    Çerçeve Etiketleri
    <frameset> Çerçeve oluşturmada kullandığımız etikettir.
    <frame> <frameset> ile çerçeveleri böldükten sonra içlerine konulacak sayfaları tanımlama işi <frame> elemanı ile yapılır. Bu etiket ile kullanılan parametreler aşağıdaki tabloda verilmiştir.

    resim eklemek için <img src=""> kullanabilirsiniz.
    arka plana renk vermek için <body bgcolor="red"> veya <body bgcolor="#0846645"> kullanabilirsiniz.
    arka plana resim eklemek için <body background=""> kullanabilirsiniz.

    stil şablonları var yani css. Css dosyaları 3'e ayrılıyor; Yerel şablon, Genel şablon ve Harici şablon. Yerel stil şablonu <body> etiketinin içine yazılır. Genel stil şablonu <head> etiketinin içine <style>...</style> yazılır. Harici stil şablonu ise <head> etiketinin içine <link> etiketini kullanırız.

    İyi Çalışmalar Dilerim!
     
    AY_akfrt_15, 7E7 ve Furkandiyebiri bunu beğendi.
    • Guest
    Katılım:
    12 Mart 2018
    Mesaj:
    457
    Alınan Beğeniler:
    425

    Özel Mesaj
    Ellerine sağlık devrem
     
  1. Kafes00 Guest

    • Guest
    Katılım:
    4 Kasım 2018
    Mesaj:
    1
    Alınan Beğeniler:
    0

    Özel Mesaj
    Teşekkürler çok yararlı oldu
     
    • Guest
    Katılım:
    5 Kasım 2018
    Mesaj:
    10
    Alınan Beğeniler:
    1

    Özel Mesaj
    saol paşalarım
     
  2. mrytx Guest

    • Guest
    Katılım:
    10 Kasım 2018
    Mesaj:
    3
    Alınan Beğeniler:
    1

    Özel Mesaj
    teşekkürler
     
  3. Theeagle1 Guest

    • Guest
    Katılım:
    13 Kasım 2018
    Mesaj:
    1
    Alınan Beğeniler:
    0

    Özel Mesaj
    Teşekkürler
     

Bu Sayfayı Paylaş