Maison > interface Web > tutoriel CSS > Mes erreurs de CSS les plus stupides

Mes erreurs de CSS les plus stupides

Christopher Nolan
Libérer: 2025-03-11 11:23:09
original
487 Les gens l'ont consulté

Mes erreurs de CSS les plus stupides

Nous avons tous été là - ces moments où notre code ne coopère tout simplement pas. Si j'avais un compteur "Days depuis la dernière erreur de codage", il lirait probablement toujours zéro. Ces erreurs vont des fautes de frappe mineures à des dossiers de modules NPM mal placés entiers!

La beauté du CSS est sa nature indulgente. Une faute de frappe simple ne casse souvent pas tout le site; La cascade le gère. Mais l'embarras demeure!

Voici quelques-unes de mes bévues CSS les plus fréquentes:

 .élément {
  Affichage: Flexbox; / *? ‍️ * /
}
Copier après la connexion

C'est un classique - oublier flex !

 .gradient {
  Gradient linéaire (45 degrés, RVB (50% 100% 90%), RVB (62% 85% 93%));
}
Copier après la connexion

Tenter un dégradé sans propriété background . C'est une solution simple, mais facilement négligé.

La proximité de «X» et «C» sur le clavier y mène:

 .élément {
  taille de police: 16pc; / * Je voulais dire des pixels! * /
}
Copier après la connexion

Confusion des unités px et pc . Cela arrive plus souvent que je ne voudrais l'admettre.

Une autre erreur courante, souvent vue dans les extraits de code:

 // Ce n'est pas un commentaire CSS.
.élément {
  / * Ceci est un commentaire CSS. * /
}
Copier après la connexion

N'oubliez pas, // est JavaScript, pas CSS!

Oublier var() autour des variables CSS:

 .élément {
  Couleur: - primaire-couleur;
}
Copier après la connexion

Et les problèmes de dénomination variables toujours présents:

 :racine {
  --Color-primaire: # FF5722;
  --Color-secondaire: # 3E2723;
}

/ * Beaucoup plus tard ... * /

.élément {
  couleur: var (- couleur primaire); / *? * /
}
Copier après la connexion

Même la copie et le coller peuvent être difficiles:

 .Element :: avant {
  contenu: ""; / * Devrait être "" * /
}
Copier après la connexion

Ces citations bouclées sournoises! Et la propriété content oublié ... ou en négligeant de définir position avant d'utiliser z-index ou Offsets.

L'illusion de la perfection

La lecture des articles de blog poli peut déclencher un syndrome d'imposteur. Ils omettent souvent les luttes et les erreurs qui ont conduit au résultat final. La vérité est que même les projets les plus impressionnants impliquent de nombreuses itérations et corrections.

Le voyage, avec ses bosses et ses détours, est souvent plus instructif que le produit final poli. Il révèle le processus de résolution de problèmes et offre des expériences d'apprentissage inestimables.

Alors, soyons honnêtes: quelles sont vos erreurs CSS les plus embarrassantes? Apprenons des bévues les uns des autres!

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal