Visual Studio 2010`da Css Kodlarının Biçimlendirilmesi

Visual Studio 2010 ile css yazarken klavyenizden “CTRL + K + D” tuşlarına bastığınızda (varsayılan ayarlarla) yazdığınız css kodları aşağıdaki şekilde biçimlendirilecektir.

Fakat ben “CTRL + K + D” tuşlarına bastığımda yukarıdaki gibi değil aşağıdaki gibi, yazdığım şekli bozmadan, her satırda tek bir tanım olacak şekilde kodlarımın biçimlendirilmesini istiyordum.

Bu konuyu biraz araştırınca benzer sorunu yaşayan bir çok kişi ve çok da kolay bir çözümü olduğunu öğrendim :)

Visual Studio 2010 uygulamasını açtıktan sonra “Tools” menüsü altından “Options“`ı açıyoruz. Ardından sol kısımdaki listeden sırasıyla; “Text Editor” > “CSS” > “Formatting” bölümlerini seçiyoruz. Daha önce ayarlarını değiştirmediyseniz fotoğrafta görüldüğü gibi sağ kısımda “Expanded” seçili durumda olacaktır.

CTRL + K + D” tuşlarına bastığınızda css kodlarınızın her bir satırda tek bir tanım olacak şekilde biçimlendirilmesini sağlamak için “Style” başlığı altındaki ilk seçenek olan “Compact rules” seçeneğini işaretliyoruz (İşaretledikten sonra alt kısımdaki “Preview” kısmından nasıl bir biçimlendirme yapılacağını görebilirsiniz).

Seçim ardından “OK” tuşuna basarak yaptığımız değişiklikleri kaydediyoruz.

Kaynak: http://www.wiliam.com.au/wiliam-blog/better-formatting-in-visual-studio-2010

Çözünürlüğe Göre Css Kullanımı

Web Öğrencisi isimli blogunda Ali`nin hazırladığı basit bir JavaScript dosyası ile rahatça çözünürlüğe göre farklı css dosyalarının yüklenmesini sağlayabiliyorsunuz.

Göz atmanızda fayda var; JavaScript – Çözünürlüğe göre stil kullanımı

Bu JavaScript dosyasında bir kaç düzenleme yapılarak çözünürlük dışında tarayıcıya (ie, ff) göre farklı css dosyalarının yüklenmesi de sağlanabilir.

Css ile Web Tasarımı

Web tasarımı ile ilgilenmeye yeni başlayan bi arkadaşımın isteği üzerine sadece css ile hazırlanmış basit bir web sayfası hazırladım. Css dosyasında her satıra detaylı açıklamalar yazdım, aynı şekilde web sayfasında da. Ne kadar basitte olsa bir kaç saatimi almıştı bu iş.

Bunun üzerine, yine css ile hazırlanmış ama daha detaylı bir tasarımı sizlerle paylaşma kararı aldım.

Görselliği 2. planda bırakarak önce çok basit, ardından biraz daha detaylı bir web sayfasını hazırlayarak burada yayınlamayı düşünüyorum. Tabi sizden gelicek fikirlere de açığım.

İnternette bolca kaynak var css`i anlatan. Tek tek konulara bölerek anlatılmış durumda zaten, bu yüzden benzer bir yapı sunmak istemiyorum ve yapacağım bu çalışma ile uygulama anında anlatmayı düşünüyorum. Yani şu özellik şu işe bu özellikte bu işe yarar diye tek tek css`i anlatmaktansa, kullanıldığı yerde açıklamasını yazarak neden orda o özellik kullanılmış onu vermek istiyorum.

Sonuçta elinizde genel hatları ile hazır bir web sitesi olacak ve css dosyasına baktığınızda hangi özelliğin neden orada kullanıldığını anlatan açıklamalar yer alacak. Aynı şekilde html kısmında da tabiki.

Neyse lafı daha fazla uzatmak istemiyorum, bu konuda düşünceleriniz yada istekleriniz varsa lütfen yorumunuzda belirtin.

Bende yorumlarınız doğrultusunda daha kullanışlı bir şeyler hazırlamış olurum böylece.

Css ile Kolay Menü Yapımı

Günümüzün web tasarım trendi olan Web 2.0`a uygun hoş görünümlü ve kullanışlı menüler hazırlamak isteyenler için bu işi sizin yerinize yapabilecek bir kaç web sitesinden, menü tasarımına farklı bir bakış açısı getiren değişik bir çalışmadan ve son olarak bu tarzda menülerin Photoshop ile nasıl tasarlandığına dair bir tutorial`den bahseden yazımı okumak isterseniz lütfen içeri buyrun…

Okumaya devam et

Css Sıfırlama (reset)

Css ile uğraşıpta tarayıcılar arasındaki yorum farkları yüzünden sorun yaşamayan yoktur sanırım.
Varsa bir adım öne çıksın :)

Bu tekniği ilk duyduğumda birazda anlatan arkadaştan kaynaklanan bilgi eksikliği yüzünden sanırım mantıksız bi şey gibi gelmişti. Çünki arkadaşımın tavsiyesi üzerine mevcut olan css koduma ekleme yaptığımda web sitesinin resmen dağıldığını görüp direk olarak arkadaşımın üzerine saldırmıştım :)

Neyse sonuçta bu tekniğin projeye başlamadan en başta css dosyasına eklenip sonradan buna göre kodlama yapılması gerektiğini öğrenmiş ve bu tekniği bende kullanmaya başlamıştım…

Okumaya devam et

Menü Tasarım Yarışması

26 Ağustos`ta bu sayfada duyurulan yarışmaya katılan yarışmacıları ve hazırladıkları menüleri görmek için  lütfen Hasan Yalçın`ın web sitesini ziyaret ediniz.

Oldukça hoş çalışmalar çıkmış ortaya, katılmış olan herkeze başarılar. Bende bir kaç çalışma yapmıştım fakat işlerimin yoğunluğundan, düzenleyip gönderemedim bir türlü. Neyse bir dahaki safere artık.

Yarışmaya katılan tasarımları görmek için…