52 – Html Input Attributes – Nitelikleri Html form içerisinde en çok kullanılan input elemanı içerisinde kullanabileceğimiz niteliklere yer verilmiştir. Örneğin bir html form elemanının zorunlu olup olmaması, varsayılan değeri, maximum yada minimum değer, telefon girişi gibi bir alanın giriş formatı gibi özellikleri inceliyoruz. value Attribute Form elemanlarına varsayılan bir değer verir. Form içerisinde varsayılan …
29 – Html Tablo Colgroup Html tabloda colgroup kullanımı istediğimiz sütunlar için özel stiller vermemizi sağlar. Tablo oluştururken <table> etiketinin hemen altında oluşturulur. colgroup ile bir grup tanımlanır ve içerisinde col ile sütunlar tanımlanır. Örnek kullanımı: colgroup altında birden fazla col tanımlanarak istediğimiz sütunlar için farklı tasarımlar yapabiliriz. Örnek Yukarıdaki örnekte her bir sütun için …
28 – Html Tablo Şekillendirme Tablolarımızın göze hoş görünmesi için bazı css özelliklerini kullanabiliriz. Html Tablosu Satır Renklendirme – Zebra Çizgileri Satırlar için farklı arkaplan renkleri kullanarak güzel bir görünüm elde edilebilir. Tablo satırlarını renklendirmek için Örnek Css Kullanımı: tr:nth-child(even){background-color:bisque;} şeklinde olabilir. Bu şekilde satırlar en yukarıdan başlayarak 2-4-6-8 şeklinde çift sayılara denk gelen satırları …
27 – Html Tabloda Hücre Birleştirme Html tablolarında hücrelerin birden fazla yer kaplamasını istiyorsak hücreleri birleştirmemiz gerekir. Sütunları birleştirmek için colspan, satırları birleştirmek için rowspan css özelliğinden yararlanırız. Html Tablosunda Sütun Birleştirme – Colspan Colspan ile yayılacak sütun sayısı belirtilir. Başlangıçta bir sütunu işgal eden verimiz colspan ile belirttiğimiz sayıda yayılım gösterecektir. Örnek Html Tablosunda Satır …
26 – Tablo Dolgu ve Boşluk – padding & spacing Html tablosunda hücrelerin içerisindeki veri ile hücrenin kenarı arasındaki mesafeyi padding (dolgu) ile, hücrelerin birbirleri arasındaki mesafeyi ise border-spacing ile ayarlarız. Html Tablo Hücre Dolgusu – table padding Html tabloda padding kullanarak hücrelerin içerisindeki veri ile kenarları arasında boşluk verilebilir. Varsayılan olarak padding sıfır ayarlıdır. …
25 – Tablo Başlıkları – Table Header Tablomuzun başlıklarıdır. Altındaki sütunların ya da yanındaki satırın başlığıdır. Table head kısaltması olan th etiketi ile tanımlanır. Yatayda veya dikeyde olabilir. Bir başlık veya birden fazla başlık kullanılabilir. Yatay Tablo Başlıkları Tablo başlıklarını yatayda kullanabilmemiz için ilk açtığımız satır içerisine th ile başlıkları tanımlayabiliriz. Örnek Dikey Tablo Başlıkları …
24 – Html Tablo Boyutu – Table Size Tablonun içerisinde bulunan satırlar sütunlar veya tablo genel hatları ile farklı boyutlarda yapılandırılabilir. Html Tablo Genişliği Tablo genişliği style attribute kullanılarak veya ayrı bir stil tanımlaması içerisinde width parametresi ile yapılır. Örnek kullanımı style=”width:75%; şeklindedir. Aşağıdaki örnekte genişlik yüzde yetmişbeş olarak ayarlanmıştır. Örnek Html Tablo Sütun Genişliği …
23 – Html Tablo Kenarlıkları – Table Borders Tablolarımızın iç ve dış kenarlarının gösterilmesidir. Farklı renklerde ve şekillerde olabilir. Tablo Kenarlık Nasıl Eklenir? Tabloya kenarlık eklemek için style tanımlaması yaparız. Örnek kullanım border: 1px solid red; şeklindedir. Buradaki 1px kenarlığımızın kalınlığını ifade eder. Solid kenarlık tipini, red ise rengi belirtir. Aşağıdaki örnekte tablonun kenarlığını 2px …
22 – Html Tablo Oluşturma Html de tablo verilerin satırlar ve sütunlar halinde düzgün bir şekilde gösterilmesini sağlayan bir yapıdır. Tablo <table> etiketi ile başlatılır ve </table> etiketi ile sonlandırılır. Html Tablo Satır Etiketi <tr> <tr> etiketi tabloda satırları ifade eder. </tr> kapanış etiketi ile satır sonlanır. Bir alt satır tekrar <tr> </tr> etiketleri ile …
