2010-11-15 13 views
38

Ne kullanmalıyım?HTML/CSS font rengi vs açık alan biçimi

<span style="color:red">test</span> 

veya

<font color="red">test</font> 

ve neden?

+2

ne. biridir. – RPM1984

+15

yumruk kullanın Diğer bir deyişle, metne "anlam" eklemezler, sadece anlam eklemeden gruplara ayırmak için kullanılmalıdırlar: http://en.wikipedia.org/wiki/Span_and_div – PetrV

cevap

45

<span> kullanmanız gerekir, çünkü as specified by the spec, <font> kullanımdan kaldırılmıştır ve muhtemelen sizin tasarladığınız gibi görüntülenmeyecektir.

+0

aslında Açıklık daha yetkili kaynağına işaret etmek için linki değiştirildi satır içi CSS – Peter

+2

div kullanımdan kaldırıldı, hiç bir zaman kullanımdan kaldırılacağına inanmak zor. açıklık tam olarak amacına uygun olarak tasarlanmıştır: metnin belirli kısımlarını semantik olarak değiştiremez. – Kyle

+1

Hiç bir zaman yayılma ve div kelimesinin ya kullanımdan kaldırıldığını söylemedim ve muhtemelen size asla katılmayacağına katılıyorum. Ancak OP'nin kırmızı renkli bir metinle, örneğin vurgu ile bir anlamı olduğunu varsaymak makul görünmektedir. Dolayısıyla bunun için semantik bir etiket kullanması gerekiyor. Ancak, metnin semantik anlamsız kırmızı renkte olması gerekiyorsa (ör. Sadece biraz renkli olması için), yayılma iyi bir seçimdir. – Peter

9

Stil kullanın. Yazı tipi etiketi kullanımdan kaldırılmıştır (W3C Wiki).

+0

(ve div) kaldırılmış değildir, ancak onlar değil CSS – fncomp

5

<font> etiketi en az XHTML içinde deprecated olmuştur. Bu, kullanımın resmi olarak "kaşındı" olduğu anlamına gelir ve gelecekteki tarayıcıların metni istediğiniz gibi görüntülemeye devam edeceğine dair bir garanti yoktur.

CSS kullanmanız gerekir. <span> etiketiyle veya ayrı bir stil sayfasıyla devam edin. specification'a göre, <span> etiketinin anlamsal bir anlamı yoktur ve yalnızca belirli bir bölgenin stilini değiştirmenize izin verir.

+0

Hayır, ne yaptığınızı gerçekten bilmiyorsanız XHTML'yi hedeflemeyin: http://www.webdevout.net/articles/beware-of-xhtml. Oradaki XHTML'in% 99,9'u (geçerli) XHTML değil. – Peter

+0

@Peter: Yeterince adil, bu konuda birçok geçerli görüş olduğunu kabul ediyorum. XHTML sadece benim kişisel tercihim. Ama "hedefleme" ile "geçerli" XML'i ima etmeyi kastediyorum. –

10

1. tercih harici stil sayfası. belirtildiği gibi

<span class="myClass">test</span> 

css

.myClass 
{ 
color:red; 
} 

2 tercihi satır içi stil

<span style="color:red">test</span> 

<font> kullanımdan kaldırıldı.

+0

Geliştirilmesi gereken tek öneri "myClass" kullanımı "redText" veya "red" yerine. – jeffmcneill

29

Hiçbiri. HTML kodunu mantıksal kodlarınızı vererek içerik ve sunumları ayırmalısınız. Bu şekilde düşün; Kör bir kişiye veya renkleri görüntüleyemeyen bir tarayıcıya, kodunuzdan geriye ne kalır? Neden kırmızı olmasını istiyorsun?

Muhtemelen, metin kırmızı yapma kararınız, bunun önemini vurgulamak istediğiniz içindir. Yani HTML kodu olmalıdır:

<em>test</em> 

Bu şekilde, hatta görsel olmayan tarayıcılar da öyle ya da metin vurgu vermek emin olun.

Sonraki adım metni kırmızı yapmaktır. Ama sadece bir kere eklemek için, her yerde renk kodu eklemek için çok daha verimli istemiyoruz: Web sitenizin daha sabit hale kırmızı olur üzerinde

<style> 
    em { color: red; } 
</style> 

Bu şekilde, tüm kod vurguladı.

4

Aslında 1 tercihi harici stil sayfası (Dış CSS), 2. tercihi geçerli sayfanın başlık bölümündeki stil etiketleri CSS yazıyor olacağını (İç CSS) olacağını söyleyebilirim

<style type="text/css"> 
<!-- CSS goes here --> 
</style> 

Ve 3. seçenek olarak - ya da son çare olarak - CSS'yi kendi etiketlerinde (Inline CSS) kullanırdım.

+2

* Asla * inline CSS kullanın! – Kyle

+0

Kabul ediyor. "Kırmızı" adlı bir CSS sınıfı oluşturun, etikete "kırmızı" sınıfı atayın - kolay ve iyi uygulama. – RPM1984

+2

Aslinda ... bu, semantik olmadiindan büyük bir sinif adi olmaz. . sadece sınıfın görünümünü ne anlama geldiğiyle değil, .warning veya .error daha iyi olurdu. – Damien

2
zaten "font etiket en az XHTML, kullanımdan kaldırıldı. Her zaman güvenli span etiketi kullanmak. Yazı Sonuçları arzu vermeyebilir yukarıda bahsedildiği gibi bu :) iyi benim için çalışıyor
<span style="color:#ffffff; font-size:18px; line-height:35px; font-family: Calibri;">Our Activities </span> 

, benim durumumda en azından öyle olmadı.

+0

Harika bir örnek; ama soruya cevap vermiyor: Neden? – jpaugh

+0

@jpaugh, neden yazı tipi etiketinin yerine yerleştirmek zaten yukarıdaki diğer üyeler tarafından adreslenmişti. etiketi en azından XHTML'de kullanımdan kaldırıldı. Teşekkürler cevabımı düzenleyeceğim. –

+1

Eh, bakmanın bir yolu bu. Demek istediğim, neden * çözümünüzü (diğer çözümlerden bağımsız olarak) kullanın? Örneğiniz hakkında benzersiz veya faydalı nedir? – jpaugh

İlgili konular