CSSer werden, wie andere IT-Positionen auch, bei der Jobsuche mit Fragen des Interviewers oder mit Prüfungsunterlagen konfrontiert. Heute haben wir 8 häufige Interviewfragen zusammengestellt. Ich hoffe, dass sie Ihnen hilfreich sein werden.
1. Der Hover-Stil wird nach dem Klicken auf den Hyperlink nicht angezeigt?
Der angeklickte Hyperlink-Stil verfügt nicht mehr über die Hover- und aktiven Stile. Die Lösung besteht darin, die Reihenfolge der CSS-Attribute zu ändern: LVHA
2. Das Margin-Double-Margin-Bug-Problem von IE6
Zum Beispiel:
<style type="text/css"> Körper {margin:0;} div {float:left; margin-left:10px; width:200px; border:1px solid red;} </style> |
Nach dem Floating beträgt der ursprüngliche Rand 10 Pixel, der IE interpretiert ihn jedoch als 20 Pixel. Die Lösung besteht darin, display:inline;
3. Warum kann der Text in Firefox die Höhe des Containers nicht vergrößern?
Container mit festen Höhenwerten in Standardbrowsern werden nicht wie in IE6 gestreckt. Wenn ich also eine feste Höhe haben und gestreckt werden möchte, welche Einstellungen sollte ich vornehmen? Die Lösung besteht darin, die Höhe zu entfernen und hier min-height:200px festzulegen. Um sich um IE6 zu kümmern, der die min-height nicht kennt, kann sie wie folgt definiert werden:
| div { height:auto!important; height:200px; |
4. Warum kann die Farbe der Bildlaufleiste des IE-Browsers nicht in Webstandards festgelegt werden?
Ursprüngliche Stileinstellungen:
<style type="text/css"> body { scrollbar-face-color:#f6f6; scrollbar-shadow-color:#eeeeee; scrollbar-arrow-color:#000; -color:#fff; scrollbar-darkshadow-color:#fff; </style> |
Die Lösung besteht darin, den Textkörper durch HTML zu ersetzen
5. Wie definiere ich einen Container mit einer Höhe von etwa 1 Pixel?
Dieses Problem wird unter IE6 durch die Standardzeilenhöhe verursacht und es gibt viele Lösungen, wie zum Beispiel: overflow:hidden | zoom:0.08 |
6. Wie lässt sich die Ebene auf FLASH anzeigen?
Die Lösung besteht darin, Transparenz für FLASH festzulegen:
| <a href="http://www.chinaz.com/">:</a> <pre lang="html" line="1"> <param name="wmode" value="transparent" /> |
7. Wie zentriere ich eine Div-Ebene im Browser?
<style type="text/css"> <!-- div { Position:absolut; oben:50%; links:50 %; Rand:-100px 0 0 -100px; Breite:200px; Höhe:200px; Rand: 1 Pixel durchgehend rot; } -> </style> |
Hier verwenden wir die prozentuale absolute Positionierung und die Methode, negative Werte außerhalb des Patches zu verwenden. Die Größe des negativen Werts ist seine eigene Breite und Höhe geteilt durch zwei.
8. Lösung für das Zentrierungsproblem verschachtelter div-Tags im Firefox-Browser
Gehen Sie von folgender Situation aus:
<div id="a"> <div id="b"> </div> </div> |
Wenn Sie b innerhalb von a zentrieren möchten, müssen Sie im Allgemeinen nur CSS verwenden, um das text-align-Attribut von a auf zentriert zu setzen. Diese Methode sieht im IE normal aus, aber in Firefox steht b auf der linken Seite.
Die Lösung besteht darin, den horizontalen Rand von b auf „Auto“ zu setzen. Legen Sie beispielsweise den CSS-Stil von b auf Folgendes fest: margin: 0 auto;