BT ifade

En azından Stil koyun

Aşamalı olarak yüklemek için bir sayfa istiyorsanız;, bunu en kısa sürede ne varsa, içeriğini görüntülemek için tarayıcı istiyorsanız olduğunu, belgenin HEAD içindeki sayfanın üst kısmında CSS koydu. Bu sayfa Bu sayfanın aşamalı oluşturmada kolaylaştırır olarak, daha hızlı yükleme gibi görünür yapar. Bu içerik bir çok daha yavaş internet bağlantıları kullanıcılar için sayfaları için özellikle önemlidir.

Bu genel kullanıcı deneyimini geliştirmek için bir belgelenmiş bir gerçektir, bu ilerleme göstergelerini ve görsel geri bildirimler sağlamak için önemlidir. , Sayfa öğeleri yeniden çizmek zorunda kalmamak için durumda IE, sayfanın blok oluşturma dahil olmak üzere kendi stillerini değişikliği, bazı tarayıcılar, CSS tamamen yüklenene kadar eğer. Bu nedenle, kullanıcı olduğunu görmek için alır Boş beyaz bir sayfa.

W3 HTML tanımlamalarına 'da CSS, HTML sayfasının HEAD bölümüne beni içermesi gerektiğini belirtiyor. at the bottom of the page, so it's best not to use it. Ayrıca IE'de, dikkat @import kullanarak aynı şekilde davranır <link> sayfanın alt kısmında, bu yüzden kullanmak en iyi değil.

Tarayıcı Özgül özelliklerini kullanma kaçının

Filtreler: Kullanım filtre Bellek tüketimini artırır ve element başına uygulanır değil, görüntü başına, sorun çarpılır öyle. Ayrıca, Filtreler IE Tescilli olup, dolayısıyla diğer tarayıcılarda beklendiği gibi çalışmaz. Eğer şeffaf ya da degrade arka istiyorsanız, görüntüleri ile 1Pixel kullanın.
İfadeler: CSS ifadeler CSS için de hoş bir özellik, ama hala IE özgü bir özelliktir. Ayrıca, bu ifadeler olduğuna dikkat etmek önemlidir sayfa işlenmiş ve yeniden boyutlandırıldığında değerlendirilir, kaydırılan ve kullanıcı sayfa üzerinde fare hareket bile. Bu sayfanızın performansı etkileyebilecek söylemeye gerek yok. Eğer lehte 'da eksileri daha fazla ağırlığa sahip' hissi sürece Dolayısıyla basit bir deyişle, CSS ifadeler kullanmaktan kaçının

CSS Externalise

Harici CSS kullanarak daha hızlı yükleme neden olacaktır sayfalarında JavaScript ve CSS dosyaları tarayıcı tarafından önbelleğe çünkü. HTML belgelerinde Inline CSS HTML belgesi talep her zaman indirilir. Bu aslında yapılan HTTP istekleri sayısını azaltabilir ama daha sonra HTML belgesinin boyutunu artırır. Harici CSS tarayıcı tarafından önbelleğe alınır; HTML belgenin boyutunu HTTP istek sayısını artırmadan düşer.

Sitenizde kullanıcıların oturum başına birden fazla sayfa görünümü var ve sayfaları yeniden kullanmak aynı komut dosyalarını ve stil birçok varsa, önbelleğe harici dosyalardan daha büyük bir potansiyel faydası var, unutmayın.

Sizin CSS Dosya Paketi

Paketleme veya CSS çatırdayan yük kere iyileştirilmesi böylece onun boyutunu azaltmak için kod gereksiz karakterleri kaldırma uygulamadır.

CSS bana satırsonu vb, beyaz boşluk gibi tüm yorum ve herhangi bir istenmeyen karakterleri kaldırarak darlığı olabilir

IE 6 Mesaj, MSIE çoğu diğer standart tarayıcılar için standart birkaç CSS özellikleri ekleyerek bize UI geliştiriciler için yeterli tür olmuştur. "Min-height" in böyle bir faydalı özellik. Hiçbir uzun soluklu açıklama ihtiyacı oldukça yalındır özelliği. Bu evler içeriği tutun ve önemlisi terazi (düz vanilya "yükseklik" mülkiyet aksine) veya CSS deyişle olabilir daha az kaplar, bir bölümü için min-height ayarlandığında, her zaman bu seti yüksekliği korur, bu gibi davranır bölümü olan "yükseklik" "otomatik" olarak ayarlanmış ...

Ayrıca IE6 çalışması gerektiğini hala kod CSS gerekmektedir bize bazı kötü geliştiriciler için, "min-height" ve un-durumu, bazen bir gösteri tıpa olabilecek ... donot umutsuzluk.

Neyse ki, biz dışarı avantaj olarak kullanmak ve hedefimize ulaşmak için yolumuzu kesmek olurdu IE yeterli tuhaflıklar var ... yani bir BÖLÜMÜ dağılımı yapmak sanki IE6 onun min-height

Çözüm 1: Altını Çiziyor Hack [kullanma ... Read more ]

.box1 {
min-height: 200px;
height:auto;
_height:200px;
}

HTML: -
<div class="box1">Some dynamic content with variable height ...</div>

---

Çözüm 2: CSS Özellik Seçici Hack kullanma

.box2 {
min-height:200px;
height:200px;
}
div[class] .box2 {
height:auto;
}

HTML: -
<div class="someclass">
<div class="box2 common">Some dynamic content with variable height ...</div>
</div>


CSS Özellik Seçici Hack tarayıcılar önceki tha IE6 bir atribute seçici göz ardı aslında yararlanır. Class = "someClass" ile başka bir kaba bölünme ihtiyacı unutmayın. Sadece bu bölümü için sınıf özniteliği içermesi, Opera, Mozilla ve MSIE7 için otomatik ve daha sonra geri yüksekliği geçersiz kılar. Atribute seçiciler desteklemiyor IE6, yok sayar.

IE6 min-height hilesi Demo bilgileri

XML ve XSL kullanırsanız, nitelik ve XSL XML düğümleri değerleri ile oynamak zorunda olduğunda, o zaman, bir zaman karşı karşıya kalabilirsiniz. Onlar bu konuda uzun soluklu bilgi ile sitelerin yükler vardır, ama hiçbiri bulundu kısa ve kesin idi ... Bu NO XML / XSL TUTORIAL, ama hile listesi çeşit-bir araya getirmek için benim girişimi ...

Birlikte çalıştığımız olacak örnek XML bu gibi görünüyor ...

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="food.xsl"?>
<food>
<fruits type="tropical">
<item name="mango" moreinfo="http://www.mango.com">Mango is the king of fruits</item>
<item name="banana" moreinfo="http://www.banana.com">Banana once a day , keeps the doctor away</item>
<item name="orange" moreinfo="http://www.orange.com">Orange is the color and rich in vitamin C</item>
<item name="Papaya" moreinfo="http://www.papaya.com">Papaya - Hot when raw, cold when ripe</item>
</fruits>
</food>

Bu yüzden XSL kullanarak bizim yukarıda XML dönüştürme başlayalım

Örnek 1: Seçilen Öznitelik az değeri gösteriliyor

<xsl:value-of select="/food/fruits/item[@name='orange']" /><br />
to get more information about <a href="{/food/fruits/item[@name='orange']/@moreinfo}" target="new" ><xsl:value-of select="/food/fruits/item[@name='orange']/@name" /> </a>

HTML sonuç gibi görünecek

Orange is the color and rich in vitamin C,
to get more information about <a href="http://www.orange.com" target="new">

Örnek 2: aracılığıyla Döngü ve tüm XML Öznitelik Adları ve Değerler görüntüleme

<xsl:for-each select="/food/fruits/item/@*">
attribute name : <xsl:value-of select="name()"/>,
attribute value : <xsl:value-of select="."/> <br />
</xsl:for-each>

HTML sonuç gibi görünecek


attribute name : name, attribute value : mango
attribute name : moreinfo, attribute value : http://www.mango.com
attribute name : name, attribute value : banana
attribute name : moreinfo, attribute value : http://www.banana.com
attribute name : name, attribute value : orange
attribute name : moreinfo, attribute value : http://www.orange.com
attribute name : name, attribute value : Papaya
attribute name : moreinfo, attribute value : http://www.papaya.com


Bu alanı izle, yeni bulgular bu güncellemeye devam edeceğiz ...