2013-02-18 36 views
6
<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>Superscript_size_in_table_cell</title> 
    <meta name="generator" content="BBEdit 10.5" /> 
    <style> 
    table { 
     width: 60%; 
    font-size: 0.8em; 
    margin-left:auto; 
    margin-right:auto; 
    border-collapse: collapse; 
    } 

    .super_script { 
    font-size: 80%; 
    vertical-align: super; 
    } 

    </style> 
</head> 
<body> 
    <table id="table_1a-27"> 
     <caption class="table_caption">Table 1A-27</caption> 
     <tr> 
      <td>Some text<span class="super_script">Note 1</span></td> 
     </tr> 
     <tr> 
      <td> 
       <ol> 
        <li>Beginning of sentence<span class="super_script">Note 2</span> than the rest of the sentence.</li> 
        <li>Some stuff here</li> 
       </ol> 
      </td> 
     </tr> 
    </table> 
</body> 
</html> 

Tablo hücresinin içeriğinin bir kısmı için metin boyutunu ve konumunu değiştirmek istiyorum ancak yukarıdaki tablo hücresinde metin için çalışmıyor gibi görünüyor. Tablo öğeleri, sadece üst yazı için değil, boyutunu ayarlamak istiyorum.Tablo hücresindeki yazı tipi boyutunu değiştir

+0

'span' eleman kullanma konusunda görünür tutarak düşünmelisiniz. Peki sorun nedir? Lütfen “işe yaramaz” ifadesinin ne anlama geldiğini, beklenen görüntülemeyi ve gerçek görüntülemenin (tarayıcıda hangi tarayıcılarda) farklı olduğunu açıklamak anlamına gelir. Ayrıca, tam metin olarak uzun bir ifadenin yer almasının anlamlı olacağı bazı gerçek durumları gösteren tam ve geçerli bir örnek yayınlamayı da düşünün. Tablo işaretlemesinin HTML tablo modelini ihlal ettiğini (ve gerçekten bir tablo olması gereken bir şey gibi görünmediğini) unutmayın. –

+0

Yanıt için teşekkürler. Safari 6.0.2'yi kullanarak, "Not 1" ve "Not 2" öğelerinin, hücrede bulunan diğer metinden daha küçük bir boyutta oluşturulmasını beklerim. Yukarıdaki örnekteki önerileri oluştururken, tarayıcının bir yazı tipi oluşturacağı boyutun alt sınırı olabileceğini keşfettim. Tablolarımın içeriğinin geri kalanından 0,8em olmasını istediğimden, üstteki metin boyutunu küçültmek, metni yeniden boyutlandırmak için tarayıcı yeteneğinin alt sınırına (veya "istekliliğe") sahip olabilir. Anymore düşünceleri büyük beğeni topluyor. Saygılar, Zephyr –

+0

Safari, diğer bazı tarayıcıların yanı sıra, en düşük yazı tipi boyutunu ayarlamak için bir kullanıcı seçeneğine sahiptir (ve bunun için çok iyi nedenler vardır).HTML'deki (veya CSS) üst simge, genel olarak kötü çalışma eğilimindedir, dolayısıyla gerçek hedefi açıklamak yardımcı olacaktır. HTML üstyazıları, yalnızca yazım boyutu doğru değil, okunabilir üst simgeler olarak indirgenmiş boyuttaki karakterlerdir. –

cevap

1

hücre sınıfını tanımlamak yoktu çünkü çalışmıyor sadece td etiketinde

class="super_script" 

koydu. hücrelerin boyutunu değiştirmek için

Eğer

table {table-layout: fixed;} 

yaptığınızdan emin olun ve siz ayarlanmalıdır! Temel bir For

+0

Hızlı yanıt için teşekkürler! Hücrenin tüm içeriğinin üst sıralarda olmasını isteseydim, ancak hücrenin içeriğinin yalnızca bir kısmının ayarlanmasını istediğimi düşünüyorum. Ayrıca, font boyutu: 0.3em; 'bir tablo içinde tanınmıyor gibi görünüyor. Düşünceler? –

2

:

1- Bir <sup>

2- tarzı sizin <sup> bu şekilde sizin 'süper metne' metni koyun:

sup { 
    position: relative; 
    font-size: 75%; 
    line-height: 0; 
    top: -0.5em; 
    vertical-align: baseline; 
} 

Ayrıca aynı konu etrafında ilginç sorular:

[Düzenle]: Bazı kullanıcılar bazı tarayıcı <sub> ve <sup> işaretlemeleri için font-size göreli boyutlandırma ile 'buggy' davranışları söz etti.

Belki CSS'nizde istendiği gibi, neredeyse okunamaz boyutta üst simge konumunda bir <span>

+0

Uygulamada bir gelişme değil. IE, tarayıcının öğe için varsayılan boyutuna ilişkin olarak (teknik özellikler için) 'font' boyutunu yanlış şekilde yorumlar; Böylece, 'sup' üzerinde 'font-size 'ayarlayarak, temel bir tarayıcı bağımlılığı sunarsınız. –

+0

@ JukkaK.Korpela: "Temel bir tarayıcı bağımlılığı sunuyorsunuz" ile ne demek istiyorsunuz? Uygun tarayıcılarda –

+0

, ana öğe boyutunun% 75'ini alırsınız; IE'de, varsayılan "sup" öğe yazı tipi boyutunun% 75'ini alırsınız. Pratikte, IE'de kural, yazı tipi boyutunu kuralı olmadan çok daha küçük yapar, Firefox'ta ise, biraz daha büyük * olur. –