Posts Tagged ‘ css ’

Kullanılmayan Stilleri Bulmak

Web sitesi hazırlarken kodların bir kısmını başka siteden aldıysanız sitedeki CSS dosyası sizin ihtiyacınızdan daha fazlasını barındırıyor olabilir. 3 satır HTML kodu için 200 satır CSS dosyası kullanırsanız gereksiz yere sitenin performansını azaltırsınız. Yapmanız gereken çok basit:

  1. İlk olarak siteden aldığınız HTML kodunu boş bir HTML dosyasına yapıştırın ve kaydedin.
  2. CSS dosyasını HTML dosyasıyla ilişkilendirin ve her iki dosyayı sitenizde bir klasöre yükleyin.
  3. Firefox tarayıcınız yoksa Firefox kurun. İşimizi görecek olan yazılım bir Firefox eklentisi.
  4. Firefox’u çalıştırın.
  5. Dust-Me Selectors eklentisini yüklemek için https://addons.mozilla.org/en-US/firefox/addon/dust-me-selectors/ sayfasını ziyaret edin.
  6. Eklentiyi yükleyin.
  7. Tarayıcıyı yeniden başlatın.
  8. Sitenize yüklediğiniz sayfayı Firefox’ta açın.
  9. Tarayıcının sağ altında pembe süpürge ikonu göreceksiniz. Tıklayın.
  10. Eklenti çalışmaya başlayacak ve HTML kodlarında bulunan sınıf ve ID’leri bulduktan sonra ilişkilendirilen CSS dosyasındakilerle kıyaslayacak ve kullanılmayanları size gösterecektir.
  11. Sadece kullandıklarınız kalacak şekilde CSS dosyasını temizlediğinizde elinizde tertemiz bir CSS dosyası olacak.

Not: Eğer tüm sitenin CSS’ini elden geçiriyorsanız bu işlemi yaparken dikkatli olun. Zira kontrol ettiğiniz sayfada kullanılmayan özellikler başka sayfalarda kullanılıyor olabilir. Eklenti tüm siteyi değil sadece açık olan sayfayı kontrol eder.

2011
01/20
YAZAR
DİZİN
Çözümler
TAGS






Yorum yazın

CSS İle Ortalanmış DIV

Web 2.0 sunduğu üstün özellikleri sayesinde kısa sürede hızla yayıldı. Web 2.0 denince işin olmazsa olmazları CSS ve Divler tabiki. Bu iki sihirli değnek web sitenizde o kadar inanılmaz hareketler ve efekler oluşturmanızı sağlıyor ki güzel bir web sitesi yapacaksanız bunlar olmadan asla bitiremiyorsunuz.

Div ve CSS bir kez daha sayfanın tam ortasını bulmak istediğimizde yardıma koşuyor.

Bize gereken ve tagleri arasına yerleştirilmesi gereken CSS ve arasına yerleştirilmesi gereken Div.

İşte gereken CSS:

html, body {
height: 100%; /* IE düzeltmesi */
}
#tamorta{
width: 100px;
height: 100px;
text-align: center;
border: 1px solid #000;
background-color: red;
color: #fff;
position: absolute;
left: 50%;
top: 50%;
margin-left: -50px;
/* 100 pixel olan div genişliğinin yarısı */
margin-top: -50px;
/* 100 pixel olan div yüksekliğinin yarısı */
}

İhtiyacımız olan Div ise daha kısa:


İşte dikey ve yatay olarak tam ortalanmış metin.

Kaynak: http://www.joe2torials.com/view_tutorial.php?view=37

2009
02/15
YAZAR
DİZİN
Çözümler
TAGS




4 yorum

Afrika’ya Yardım


FeedBurner

Yemek Tarifleri

 

Page optimized by WP Minify WordPress Plugin