CSSer は、他の IT 職と同様に、仕事を探すときに面接官からの質問や与えられた試験問題に直面することになります。今日は面接でよくある質問を 8 つ集めました。お役に立てれば幸いです。
1. ハイパーリンクをクリックしてもホバー スタイルが表示されません。
クリックされたハイパーリンク スタイルには、ホバー スタイルとアクティブ スタイルがなくなりました。解決策は、CSS 属性の順序を変更することです: LVHA。
2. IE6のマージンダブルマージンバグ問題
例えば：
<style type="text/css"> 本文 {マージン:0;} div {フロート:左; 幅:200ピクセル; ボーダー:1ピクセル </スタイル> |
フローティング後、元のマージンは 10 ピクセルですが、IE はそれを 20 ピクセルとして解釈します。解決策は、display:inline; を追加することです。
3. Firefox のテキストでコンテナの高さを拡張できないのはなぜですか?
標準ブラウザで高さが固定されたコンテナは、IE6 のように引き伸ばされません。では、高さを固定して引き伸ばしたい場合は、どのような設定をすればよいでしょうか。解決策は、高さを削除して、min-height:200px を設定することです。min-height を知らない IE6 に対応するために、次のように定義できます。
| div {高さ:自動!重要な高さ:200ピクセル; |
4. IE ブラウザのスクロール バーの色を Web 標準で設定できないのはなぜですか?
元のスタイル設定:
<style type="text/css"> ボディ { スクロールバーの顔の色:#f6f6f6; スクロールバーの影の色:#eeeeee; スクロールバーの矢印の色:#000; -カラー:#fff; スクロールバー-ダークシャドウ-カラー:#fff; </スタイル> |
解決策は本文をhtmlに置き換えることです
5. 高さ約 1px のコンテナを定義するにはどうすればよいですか?
IE6 でのこの問題はデフォルトの行の高さが原因であり、次のような多くの解決策があります。
6. レイヤーを FLASH 上に表示するにはどうすればよいですか?
解決策は、FLASH の透明度を設定することです。
| <a href="http://www.chinaz.com/">:</a> <pre lang="html" line="1"> <param name="wmode" value="transparent" /> |
7. div レイヤーをブラウザーの中央に配置するにはどうすればよいですか?
<style type="text/css"> <!-- ディビジョン { 位置:絶対; トップ:50%; 左:50%; マージン:-100px 0 0 -100px; 幅:200ピクセル; 高さ:200ピクセル; ボーダー: 1 ピクセル赤一色; } --> </スタイル> |
ここではパーセント絶対位置決めを使用し、パッチの外側で負の値を使用する方法を使用します。負の値のサイズは、それ自体の幅と高さを 2 で割ったものになります。
8. Firefox ブラウザでネストされた div タグの中央揃えの問題の解決策
次のような状況を想定します。
<div id="a"> <div id="b"> </div> </div> |
b を a 内で中央揃えにしたい場合、通常は CSS を使用して a の text-align 属性を中央に設定するだけで済みます。このメソッドは IE では正常に見えますが、Firefox では b が左側になります。
解決策は、b の水平マージンを auto に設定することです。たとえば、b の CSS スタイルを次のように設定します。 margin: 0 auto;