1. 首頁
  2. 問答
  3. 相對大小CSS問題

相對大小CSS問題

2009-01-27 87 views
1

我有這樣的代碼相對大小CSS問題

<html> 
<head> 
    <style type="text/css"> 
    .frame     {width: 50em; border: 1px solid black} 
    .frame label   {width: 20em; display: block; text-align:right; border: 1px solid green} 
    .frame label span  {width: 20em; display: block; font-size: .5em; border: 1px solid red; text-align: right} 
    </style> 
</head> 
<body> 
    <div class="frame"> 
    <label> 
    Label 
    <span> 
    Span 
    </span> 
    </label> 
    </div> 
</body>

紅色<span>設置爲20em。但它應該像綠色<label>一樣大。儘管如此，我仍然希望將字體大小保持在紅色部分。不幸的是，即使font-size是一半大，我也不能使用40em來獲得相同的大小。 任何想法如何解決這個問題？

來源

2009-01-27 2ni

回答

1

如果您沒有爲SPAN元素（或width:100%）聲明寬度，則其屬性display:block已經確保其寬度將是完整的可用寬度。

來源

2009-01-27 16:00:43 Gumbo

2

px不是一個選項，因爲我確實想讓設計「可擴展」。我剛剛發現，它適用於跨度「寬度：100％」。

來源

2009-01-27 15:46:57 2ni

+0

是的，寬度：100％;將它設置爲包含元素的100％ - 這可能是一個更好的設計。 – 2009-01-27 15:49:21

1

請注意，使用em的是relative to the containing em size。當使用px或pt時，您的尺寸與屏幕分辨率有關。這就是爲什麼你在20em標籤內獲得紅色span 20em的寬度。

來源

2009-01-27 16:21:43 null

相關問題

 相關問題