ホームページ >ウェブフロントエンド >htmlチュートリアル >html と css で発生した問題 (1)_html/css_WEB-ITnose

html と css で発生した問題 (1)_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-21 08:49:29893ブラウズ

背景画像を div に追加するには、幅と高さを設定する必要があります

例: 次のコードがアイコンの幅と高さの値を設定しない場合、背景はdiv にコンテンツがあるため、画像は Web ページに表示されません。コンテンツがなく、幅と高さが設定されていない場合、div は空になります。デフォルトの高さは 0、幅は 0 です。 。

.icon{background:url("../images/icon/shopIcon.png")left top no-repeat;float:left;}

float:leftがない場合, Display:inline-block を追加する必要があります。追加しないと画像が表示されません

inline-block、ブロックとインラインの概念と違い

全体的な概念

1 .block 「inline」と「inline」の 2 つの概念は、正確には、ブロックレベル要素 (ブロックレベル要素) とインライン要素 (インライン要素) である必要があります。通常、ブロック要素は独立したブロックとして実現され、別の行に変更されます。インライン要素は前後で改行されず、行がいっぱいになるまで一連のインライン要素が 1 行に表示されます。

2. 一般に、HTML 要素には独自のレイアウト レベル (ブロック要素またはインライン要素) があります。

- 一般的なブロックレベル要素には、DIV、FORM、TABLE、P、PRE、H1 が含まれます。 ~H6、DL、OL、ULなど- 一般的なインライン要素には、SPAN、A、STRONG、EM、LABEL、INPUT、SELECT、TEXTAREA、IMG、BR などが含まれます。

3. ブロック要素にはブロック要素とインライン要素を含めることができますが、インライン要素にはインライン要素のみを含めることができます。これは一般的な記述であり、各特定の要素に含めることができる要素も特定であるため、この規則は個々の要素には適用されないことに注意してください。たとえば、P 要素にはインライン要素のみを含めることができますが、ブロック要素は含めることができません。

4. 一般に、display:inline および display:block の設定を通じて要素のレイアウト レベルを変更できます。

複数の浮動子要素の幅の合計が親要素の幅を超える場合の解決策

複数の浮動子要素の幅の合計が親要素の幅を超える場合の解決策親要素と最後の要素の幅が小さくなります: margin-right :-x px; 幅の範囲が親要素の幅を超える場合、親要素のスタイルを設定します overflow:hidden;

DD_belatedPNG IE6 が PNG-24 をサポートしていない問題を解決する解決策

DD_belatedPNG.fix ('div,ul,ol,li,dt,dd,dl,span,img,a,em,strong,h1 ,h2,h3,h4,h5,h6,p');

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。