‘XHTML’ etiketi için sonuçlar
Form alanlarına odaklanma
Ekim 3rd, 2007 • 6 yorum CSS, Javascript, XHTML
Etiketler: CSS, focus, form, Javascript, odaklanma, XHTML
Form alanları genelde kullanıcıların en çok sıkıldıkları alanlardır. Bu sıkıntıyı gidermek için kod yazarları çeşitli yöntemler geliştirmektedir. CSS ve ajax tabanlı çözümlerle gayet güzel sonuçlar çıkmaktadır. Biz burada fazla derine inmeden kullanıcının form alanlarına odaklandığında form alanına farklılıklar vererek daha belirgin hale getirmeyi göreceğiz. Okumaya devam edin »
CSS ve Tipografi
Eylül 14th, 2007 • 23 yorum CSS, Web Standartları, XHTML
Etiketler: CSS, font, font-family, font-size, font-weight, letter-spacing, line-height, satır-yüksekliği, tipografi, Web Standartları, word-spacing, XHTML, yazı tipi, yazı-tipi isimleri
“Tipografi(Yunancaτύπος (typos)=”form” ve γραφία (graphia)=”yazmak” sözcüklerinden)yazıyı bir forma sokma sanatı ve tekniğidir. Font (yazı tipi), font büyüklüğü,satır uzunluğu, satır arası boşluk ve benzeri unsurların kombinasyonları ileyapılır. Yayımlanacak yazınsal içeriğin bir forma sokulması veya tasarımı olarakda tanımlanabilir. Türkçe tipografya olarak da çevrilmiştir. TerimTürkçe’yeFransızca’dangeçmiştir.” Kaynak: Vikipedi
İlk CSS derslerimizde CSS’in avantajlarını sıralarken metinlere daha fazla hükmetme özelliğine sahip olduğumuzdan bahsetmiştik. Tipografihakkında sizlere genel bir bilgi verecek değilim, bu benim haddimede değil zaten. Biz buradadaha çok Stil Şablonlarının bize tipografi adına kazandırdıklarını göstermeyeçalışacağız ve CSS ile sayfalarımızı daha dikkat çekici ve okuna bilir hale getireceğimizi göreceğiz. Tipografihakkında genel bir bilgi vermesi açısından güzel bir çalışma olan Doç. Hasip Bektaş’ın “İnternetteki Tipografi Sorunları ve GörselKirlenmeye Karşı Öneriler” adlı makalesini okumanızı tavsiye ederim. Ayrıca kaynakçakısmındaki linklerden de daha fazla bilgi alabilirsiniz.
Tablo Özellikleri
Eylül 10th, 2007 • 28 yorum CSS, Web Standartları, XHTML
Etiketler: boder-spacing, border-collapse, caption-side, CSS, empty-cells, table, table-layout, tablo, Web Standartları, XHTML
Daha önce "CSS ile Tabloları şekillendirmek" adlı makalemizde tablo yapılarını gördük ve görünümünü daha güzel nasıl yaparız onun üzerinde durmuştuk. W3C bu durumu göz önünde bulundurarak tablo ve tablo elementlerinin görünümünü düzenlemek için tablo özellikleri ekledi. Tablolar diğer HTML elementlerinden daha farklı kendine has elementlerdir ve farklı özellikleri vardır. Burada CSS2 ile birlikte gelen yeni özellikleri inceleyeceğiz.
CSS2 ile birlikte gelen bu özelliklerden birçoğumuzun haberi olmayabilir. Ancak bizlere yardımcı olacak bu özelliklere göz atmak güzel. Bu özellikleri uygulamamızda en önemli etken tabiki IE’nin bu özelliklerin bir kısmını desteklememesidir. Bu tabiki IE’ye puan kaybettiriyor ve Microsoft’da bunun farkına geçte olsa vardığı söyleniyor ve IE8 ile birlikte tam CSS desteğini bizlere sunacakmış, tabi o zamana kadar Firefox IE’yi silip süpürmezse :D
Kutu Modeli – Görünüm Efekti Özellikleri
Eylül 7th, 2007 • 32 yorum CSS, Web Standartları, XHTML
Etiketler: clip, CSS, görünürlük-özellikleri, Kutu-Modeli, overflow, visibility, Web Standartları, XHTML
Bu aralar CSS kitabına(e-kitap) ağırlık verdim. Kitaptaki eksik bölümleri tamamlıyorum. İnşallah en yakın zamanda bitecek. Bu konuda onlardan biri.
Kutu elementlerin görünümüne çeşitli etkiler yapan özellikleri göreceğiz bu makalede çoğu CSS2 ile birlikte gelen bu özellikler aşağıda sıralanmıştır.
- overflow – taşma
- clip – kırpma
- visibility – görünürlük
Tablo kolon genişliğini css ile ayarlama
Ağustos 23rd, 2007 • 11 yorum CSS, XHTML
Etiketler: CSS, gmail, tablo, tablo-hücre-genişliği, Tablolar, XHTML
Tablolarda bazen içeriğe göre tablonun genişlemesini istemeyiz veya içeriği aşağı kaymasını engellemek isteriz. İşte çözüm hemde Gmail’den.
Google bize web hakkında örnekleri ile de yardım ediyor. Gmail’de tablo genişliğini sabitlemenin daha doğrusu metinin tablo genişliğine göre overflow:hiden uygulamasını gösteren güzel bir yöntem
.grid {
table-layout: fixed;
}
.grid * td {
empty-cells: show;
overflow: hidden;
width: 100%;
}
Güzel bir ayrıntıyı yakalamışlar. table-layout: fixed; tanımı işin püf noktası
Örnek sayfayı görmek için tıklayınız.
Kayanak: http://blog.opencomponentry.com/2007/08/22/gmail-table-column-sizing-css-fun/
Float Uygulanmış Elementleri Tam Kapsayamama Sorunu
Ağustos 20th, 2007 • 46 yorum CSS, Web Standartları, XHTML
Etiketler: :after, clear, clearfix, CSS, float, kapsayamama-sorunu, Web Standartları, XHTML
Float CSS ile web sayfası kodlamak için en çok kullandığımız özelliktir. Beni bu makaleyi yazmaya iten en önemli etkende float’ın çok fazla kullanılması ve bu sorunla birçok kez karşılaşmamdır.
Okumaya devam edin »
