CSSer, comme d'autres postes informatiques, sera confronté à des questions posées par l'intervieweur ou à des tests remis lors de la recherche d'un emploi. Aujourd'hui, 52CSS.com a rassemblé 8 questions d'entretien courantes, en espérant qu'elles vous seront utiles.
1. Le style de survol n'apparaît pas après avoir cliqué sur le lien hypertexte ?
Le style du lien hypertexte cliqué n'a plus les styles de survol et actif. La solution est de changer l'ordre des attributs CSS : LVHA.
2. Problème de bug de double marge d'IE6
Par exemple:
<style type="text/css"> corps {marge:0;} div {float:left; margin-left:10px; largeur:200px; bordure:1px rouge uni;} </style> |
Après le flottement, la marge d'origine est de 10 px, mais IE l'interprète comme 20 px. La solution consiste à ajouter display:inline;
3. Pourquoi le texte dans Firefox ne peut-il pas augmenter la hauteur du conteneur ?
Les conteneurs avec des valeurs de hauteur fixes dans les navigateurs standards ne seront pas étirés comme dans IE6. Donc, si je veux avoir une hauteur fixe et être étiré, quels paramètres dois-je effectuer ? La solution est de supprimer la hauteur et de définir ici min-height:200px, afin de prendre en charge IE6 qui ne connaît pas la hauteur min, elle peut être définie comme ceci :
| div {hauteur:auto!important;hauteur:200px;hauteurmin:200px; |
4. Pourquoi ne puis-je pas définir la couleur de la barre de défilement du navigateur IE dans les standards Web ?
Paramètres de style d'origine :
<style type="text/css"> body { scrollbar-face-color:#f6f6f6; scrollbar-highlight-color:#fff; scrollbar-shadow-color:#eeeeee scrollbar-3dlight-color:#eeeeee scrollbar-arrow-color:#000; -color:#fff; barre de défilement-darkshadow-color:#fff } </style> |
La solution est de remplacer le corps par du HTML
5. Comment définir un conteneur d'une hauteur d'environ 1px ?
Ce problème sous IE6 est causé par la hauteur de ligne par défaut, et il existe de nombreuses solutions, telles que : overflow:hidden zoom:0.08 |
6. Comment faire afficher le calque sur FLASH ?
La solution consiste à définir la transparence pour FLASH :
| <a href="http://www.chinaz.com/"> :</a> <pre lang="html" line="1"> <param name="wmode" value="transparent" /> |
7. Comment centrer une couche div dans le navigateur ?
<style type="text/css"> <!-- div{ position : absolue ; haut : 50 % ; gauche : 50 % ; marge : -100px 0 0 -100px ; largeur : 200 px ; hauteur : 200 px ; bordure : 1 px rouge uni ; } --> </style> |
Ici, nous utilisons le positionnement absolu en pourcentage et la méthode d'utilisation de valeurs négatives en dehors du patch. La taille de la valeur négative est sa propre largeur et sa hauteur divisées par deux.
8. Solution au problème de centrage des balises div imbriquées dans le navigateur Firefox
Supposons la situation suivante :
<identifiant div="a"> <div id="b"> </div> </div> |
Si vous souhaitez centrer b dans a, il vous suffit généralement d'utiliser CSS pour définir l'attribut text-align de a au centre. Cette méthode semble normale dans IE ; mais dans Firefox, b sera à gauche.
La solution est de définir la marge horizontale de b sur auto. Par exemple, définissez le style CSS de b sur : margin: 0 auto ;