その中の高さと同じではないのはなぜ高DOCTYPEはXHTML 1.0厳格であるとき？

StackOverflow https://stackoverflow.com/questions/1450274

  •  11-09-2019
  •  | 
  •  

質問 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
</head>
<body>

<table width="100%" cellspacing="0" cellpadding="0">
    <tr>
        <td align="right" colspan="5">
            <span class="validationInline">*</span> 
            <span class="hint">Required fields</span>
        </td>
    </tr>
    <tr>
        <td colspan="5" background="http://media.monster.com.hk/bgr_8.gif">
            <img src="/static/cleardot.gif" height="1" width="1" />
        </td>
    </tr>
</table>

</body>
</html>

は、ここでそれをチェックアウトすることができます： http://maishudi.com/tt2.htmlする

私はその部分を削除すると、それは通常のようになりますので、それは、DOCTYPEによって引き起こされています知っています：

http://maishudi.com/tt.htmlする

だから、間違っているのでしょうか？どのように私はそれがDOCTYPEで作業することができますか？

役に立ちましたか？

解決

注：これはおそらく、ブラウザに依存し
。 指定されていない場合、ブロックレベル要素（ETC TD、DIV）のサイズは、その内容によって撮影された空間によれば、必要なだけ大きいであろう。指定された場合、コンテンツが大きければ、それはその場合には、必要に応じて拡大する、を除くを、それに応じて拡大しようとします。

あなたの例では、細胞は、単一の行のサイズを取る単一の文字（改行なしスペース）を、含まれています。したがって、ブロック要素は、少なくとも1行の高さに高くなければなりません。それはどんな小さいサイズを仮定することはできません。あなたの身長宣言は無視されていた理由はここにあります。

あなたはこのスタイルを使用する必要があります：

line-height: 1px;

これは、1pxのための行の高さを設定します。行の高さの要素ではないので、上記のルールは適用されません。

他のヒント

このルールでスタイルブロックを追加します。

td img {display: block;}

と https://developer.mozilla.org/en/Images,_Tablesを参照してください。 _and_Mysterious_Gapsは完全な説明のためにを。

の背景には、TD要素のための標準的な属性が理由ではありません。代わりに使用します：

style="background: url(/path/to/image.png);"

あなたの1枚のピクセルの画像については、私は、この表のセルを表示させるためだけであると仮定しますか？もしそうなら、それはそれを行うためのお勧めの方法はありません。あなたが行うことができますいずれかます：

table { empty-cells: show; }

CSSで私はIE6がそれをサポートしているとは思いませんが。より標準に準拠の方法は、ノーブレークスペースを使用することです。

<td>&nbsp;</td>
ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top