HTML

Tablo Etiketleri 5

Tablolar sayesinde sayfamızdaki nesnelerin yerleşimini, hizalamasını ve sayfa yapısını istediğimiz şekilde ayarlayabiliriz. Örneğin sayfayı 3 sütuna ayırıp içeriğimizi buna göre hazırlayabiliriz. Tablo oluşturabilmek için 3 etikete ihtiyacımız var: 1. etiketleri ile tablonun başladığı ve bittiği yer belirlenir. 2. etiketleri ile her bir satırın başladığı ve bittiği yer belirtilir. 3. etiketleri ile tr etiketleri arasında hücreler oluşturulur. Önce tablo, sonra da satırlar oluşturulur. Son olarak da her satırdaki sütunlar (hücreler) oluşturulur. Tablo Etiketleri

Tabloda satır oluşturmak için kullanılır. Tablo Etiketleri hücre1 hücre2

Tabloda satır oluşturmak için kullanılır. Tablo Etiketleri 11-A 11-B 11-C

Tabloda sütun oluşturmak için kullanılır. Tablo Etiketleri 1.Sütun 2.Sütun

Tabloda sütun oluşturmak için kullanılır. Tablo Etiketleri satır 1, hücre 1 satır 1, hücre 2 satır 2, hücre 1 satır 2, hücre 2

etiketi parametreleri: Bu parametre hücrenin ve tablonun etrafındaki çerçevenin kalınlığını ayarlamak için kullanılır. Tablonun kenarlık rengini belirlemek için kullanılır. Tablonun genel arka plan rengini belirlemek için kullanılır. Tablonun arkasına resim konulabilir. Tablo Etiketleri

Hücre 1 Hücre 2

etiketi parametreleri: Tablonun pixel cinsinden genişliğini ayarlamak için kullanılır. Tablonun pixel cinsinden yüksekliğini ayarlamak için kullanılır. Tablonun içerisindeki hücrelerin, birbirlerinden ve tablo sınırlarından uzaklığını pixel olarak ayarlamak için kullanılır. Hücrelerin içerisindeki metin, resim, v.s gibi web sayfası öğelerinin hücre sınırlarından uzaklıklarını ayarlamak için kullanılır. ; ; Tablonun konumunu ayarlamayı sağlar. Tablo Etiketleri

Hücre 1 Hücre 2

Tablo Etiketleri Hücre 1 Hücre 2 Hücre 1 Hücre 2

Tablo Etiketleri Hücre 1 Hücre 2 Hücre 1 Hücre 2

etiketi parametreleri: Hücrenin arka plan rengini, diğer hücrelerden veya tablonun genel arka planından bağımsız olarak değiştirir. Hücrenin arka planına bir resim yerleştirir. Hücre genişliğini belirlemek için kullanılır. Hücre yüksekliğini belirlemek için kullanılır. Tablo Etiketleri

Hücre 1 Hücre 2 Hücre 3 Hücre 4

etiketi parametreleri:, ; Hücrenin içerisinde yer alan metin, resim, grafik vs. gibi web sayfası öğelerini sola, sağa veya ortaya hizalayabiliriz.,, sadece ile birlikte kullanılır, hücre içeriğini dikey olarak tablonun tepesine(top), ortasına(middle) veya tabanına(bottom) hizalar. Not : Align parametresi hücre içinde yatay hizalama yapar. Valign parametresi hücre içinde düşey hizalama yapar. Tablo Etiketleri

Hücre 1 Hücre 2 Metin

etiketi parametreleri: Bu hücrenin genişliğinin 2 sütun genişliğinde olduğunu gösterir. Bu hücrenin yüksekliğinin 3 satır yüksekliğinde olduğunu gösterir. Tablo Etiketleri

3 satır birleştir 3 sütun birleştir H T 2 satır birleştir M L 4 sütun birleştir

Örnekler 1

Ders Programı Dersler Pazartesi Salı Çarşamba Perşembe Cuma Kimya</TD > Matematik Kimya Matematik Resim Türkçe Tarih İngilizce Türkçe Beden Eğitimi Dinlenme Kimya Matematik Kimya Matematik Proje Türkçe Tarih İngilizce Türkçe

Örnekler 2

Tablo Uygulamarı Bilişim Dersler Programlama Temelleri Paket Programlar Temel Elektronik Teknik Resim Bilişim Teknolojileri Temelleri Web Tasarım ve Animasyon Grafik Animasyon

Örnekler 3

Alış Veriş Tablosu Tür Ürün Fiyat Beyaz Eşya Buzdolabı TL Ç.Makinesi TL Fırın TL B.Makinesi TL D.Dondurucu TL Küçük Ev Aletleri Meyve Sıkacağı TL M.Robotu TL Toplam TL

başlık etiketi: etiketi altında, başlık verisi içeren hücre oluşturulmasını sağlar. Tablo Etiketleri Okul No Adı Soyadı 2586 Ali Can 2895 İpek Yılmaz

Tablo(table) Kullanarak Sayfa Tasarımı yapmak Tablo Etiketleri

WEB SİTEME HOŞGELDİNİZ SİTE İÇERİĞİ BURADA MENÜ ALT BÖLÜM

Örnek 4 AnasayfaGaleriİletişim Anasayfa Galeri İletişim

Örnek 5

Örnekler 5 Hesap Makinesi Düzen Görünüm Yardım 0, &nbsp Geri tuşu CE C MC / sqrt MR * % MS /x M+ 0 +/-, + =

6 Form Etiketleri

Bir form, form elemanlarını içinde bulunduran alandır. Form elemanları kullanıcıların bilgi girmesini sağlayan elemanlardır. (metin alanları, açılabilir listeler, seçenek kutuları, kontrol kutuları) Form Etiketleri

Eleman türüAçıklamasıÖrnekGörünüm textMetin kutusu password Şifreler için kullanılan Metin kutusu checkboxOnay kutusu radioRadyo buton Erkek Kadın

Form Etiketleri Eleman türüAçıklamasıÖrnekGörünüm file Dosya seçme elemanı textareaBüyük metin alanı varsayılan değer select, option Seçim listesi ve seçim listesi seçenekleri Bursa İstanbul Ankara submit Form gönderme tuşu

Kullanılacak Parametre Görevi NAME Girilen verinin hangi değişken ismi altında değerlendirileceğini belirtmek için kullanılır. Mutlaka belirtilmelidir. SIZE text ve password elemanlarında karakter sayısını, diğerlerinde ise piksel cinsinden genişliği belirtmek için kullanılır. SRC "image" elemanında resim dosyasını belirtmek için kullanılır. TYPE Eleman türü belirtilir. text, password, checkbox, radio, submit, reset, file, hidden, image, button değerlerinden biri kullanılır. Form Etiketleri

Giriş (Input) En çok kullanılan form etiketi etiketidir. Kullanılacak Parametre Görevi ALIGN Elemanın form üzerinde nasıl konumlanacağını belirtmek için kullanılır (left, center, right). CHECKED Kontrol olarak bir işaretleme veya seçim kutusu kullanıldığında CHECKED değeri bu kutuların işaretlenmiş olarak karşımıza gelmesini sağlar. MAXLENGTH text ve password elemanlarında girilebilecek en çok karakter sayısını belirtmek için kullanılır. Öntanımlı değeri sınırsızdır. DISABLED disabled="disabled" şeklinde kullanıldığında o elemanı devre dışı hale getirir. Eleman sayfada görünür fakat seçilemez ve değiştirilemez. Form Etiketleri

Text: Formumuza tek satırlık yazı girdisi eklemek için kullanıyoruz. Button: Düğme eklemek için kullanılır. Düğme üzerinde yazılacak ifadeyi value’den sonra belirtiyoruz. Form Etiketleri Üye Adı: Üye Adı:

Password: Şifre girişi yapılacak durumlarda kullanılır Form Etiketleri Üye Adı: Şifre:

radio: Seçenek eklemek içim kullanılır. Burada dikkat edilmese gereken eğer tek bir tanesi seçilsin istiyorsanız name’lerini aynı yazmalısın. Farklı name verdiğinizde birden fazla seçim gerçekleşebilecektir. Form Etiketleri … Adı: Soyadı: Cinsiyet:Bay Bayan

Checkbox: Onay kutusu eklemek için kullanılır.Seçili olmasını istiyorsanız checked veya checked=”on” yazmalısınız.( ) Form Etiketleri … İlgi Alanlarınız: Müzik Spor Sinema Tiyatro

Select-option: Açılır menü eklemek için kullanılır. option etiketleri arasına seçeneklerin her biri yazılır. Seçeneklerin hepsi select etiketleri arasına alınır. Size ile açılır menünün yüksekliğini değiştirebilirsiniz. Birden fazla seçim yapabilmek için multiple’yi kullanın.( ) Form Etiketleri … Doğum Yeri: İstanbul Ankara İzmir Diğer

textarea: Uzun satırlı mesajlar eklemek istediğimiz zaman kullanılır. cols ile enini, rows ile boyunu piksel olarak ölçülendiririz. Bunda input’u kullanmıyoruz. Form Etiketleri … Mesaj:

Submit: Verileri sunucuya yollamak için kullanılır. Value değeri düğme üzerine yazılan metini belirler. Reset: Formdaki nesneleri temizlemek için kullanılır. Value değeri düğme üzerine yazılan metini belirler. Form Etiketleri …

fieldset:Forma kenarlık eklemek için kullanılır. legend: Formadaki çizginin üzerine başlık eklemek için kullanılır. align kullanılarak hizalama(left: sola, center: ortaya, right: sağa) yapılabilir. ör: gibi. Form Etiketleri Kişi Bilgileri …

Örnekler 1

Adınız Soyadınız: Adres: Telefon: Doğum Tarihiniz: Gün 1 31 Ay ocak aralık Yıl Çorbalar Mercimek İşkembe Yemekler Pilav Et Kavurma Patlıcan Kebap Döner Et Sote Türlü Tatlılar Kadayıf Sütlaç