localisation actuelle：Maison > Articles techniques > programmation quotidienne > connaissance CSS
- Direction：
- tous web3.0 développement back-end interface Web base de données Opération et maintenance outils de développement cadre php programmation quotidienne Applet WeChat Problème commun autre technologie Tutoriel CMS Java Tutoriel système tutoriels informatiques Tutoriel matériel Tutoriel mobile Tutoriel logiciel Tutoriel de jeu mobile
-
- Spectre: un cadre CSS léger
- Framework CSS Spectre: solutions CSS légères, réactives et modernes Dans le développement de projets, le cadre est capable de réduire considérablement le temps de développement. Les cadres populaires comme Bootstrap sont riches en fonctionnalités, mais toutes les fonctionnalités ne conviennent pas à chaque projet. Cet article présente un nouveau cadre léger, moderne, réactif et adapté aux mobiles - Spectre. La taille après compression et GZIP est d'environ 6,8 Ko. En plus du système de réseau de base, il fournit également de nombreux autres composants pratiques tels que les onglets, les boîtes modales et les cartes. Ce tutoriel vous donnera un bref aperçu du cadre et fournira des conseils pour vous permettre de démarrer rapidement. Points clés Spectre est un cadre CSS léger, moderne, réactif et convivial qui peut être grand
- tutoriel CSS . interface Web 565 2025-02-20 13:02:11
-
- ATOZ CSS Astuce rapide: avantages des valeurs REM et EM
- Points clés L'utilisation d'unités relatives telles que "EM" pour définir la taille du texte et l'espacement élémentaire est plus flexible que l'utilisation de pixels, en particulier dans les projets réactifs. Cependant, les unités "EM" peuvent causer des problèmes avec des éléments imbriqués, ce qui les a fait croître ou rétrécir de façon exponentielle à chaque niveau de nidification. L'unité «REM» est une alternative plus fiable à la définition de la taille de la police, car elle est toujours calculée en fonction de la taille de la police de l'élément racine. Cela évite la croissance exponentielle ou le retrait qui se produit lors de l'utilisation d'unités "EM" dans des éléments imbriqués. Pour la prise en charge du navigateur, en particulier pour les anciennes versions d'Internet Explorer, vous pouvez utiliser des alternatives JS Polyfill ou PX. Si vous utilisez Sass,
- tutoriel CSS . interface Web 129 2025-02-20 13:00:14
-
- ATOZ CSS Astuce rapide: comment utiliser les caractères Unicode
- Cet versement de la série CSS ATOZ explore les caractères Unicode et leurs applications CSS. Apprenez à intégrer de manière transparente des symboles et des icônes dans vos conceptions Web. Une transcription complète et un screencast sont disponibles pour une compréhension plus approfondie. Unicode ch
- tutoriel CSS . interface Web 976 2025-02-20 12:49:10
-
- ATOZ CSS Astuce rapide: justifier le texte et utiliser Flexbox
- Cet article fait partie de la série ATOZ CSS. Vous pouvez trouver d'autres entrées pour la série ici. Voir l'enregistrement plein écran et les instructions sur l'alignement du texte ici. Bienvenue dans notre série Atoz CSS! Dans cette série, j'explorerai différentes valeurs (et propriétés) de CSS qui commencent par différentes lettres dans l'alphabet. Nous savons que parfois l'enregistrement d'écran ne suffit pas, donc dans cet article, j'ai ajouté un nouveau conseil / cours sur l'alignement du texte. J signifie l'alignement du texte Il n'y a plus rien à dire sur l'alignement du texte, donc dans cet article, nous allons faire un détour dans le monde de Flexbox et chercher des moyens d'aligner le contenu. Dans l'enregistrement à l'écran de J Letters, nous discutons du texte
- tutoriel CSS . interface Web 114 2025-02-20 12:26:12
-
- Présentation des bootcards: les cartes bootstrap ont été facilitées
- Bootcards: un cadre d'interface utilisateur basé sur bootstrap pour la création d'interfaces de carte Les bootcards simplifient la création d'interfaces basées sur des cartes visuellement attrayantes à l'aide de bootstrap. Sa conception à double vole s'adapte parfaitement aux ordinateurs de bureau et aux appareils mobiles, ce qui en fait un identifiant
- tutoriel CSS . interface Web 226 2025-02-20 12:08:10
-
- Comment et pourquoi vous devriez insérer votre CSS critique
- Améliorer les performances du Web: stratégies et conseils pour l'inlindre CSS clé Cet article explore les moyens d'installer CSS clé (intégrer les règles CSS directement dans les documents HTML) pour optimiser les performances du site Web. En inclinant CSS critique, le rendu Web peut être considérablement accéléré, en particulier le chargement du contenu de premier écran, évitant les retards de rendu causés par des demandes HTTP supplémentaires pour obtenir des fichiers CSS externes. Points clés: Identifiez avec précision CSS clé: CRICT CSS fait référence au code CSS minimum requis pour rendre le contenu sur le premier écran. Cela varie d'une page à l'autre et nécessite des outils (tels que Google Pagespeed Insights, Critical Path CSS
- tutoriel CSS . interface Web 209 2025-02-20 11:52:15
-
- ATOZ CSS Astuce rapide: texte d'espace réservé
- Cet article fait partie de la série ATOZ CSS. Vous pouvez trouver d'autres entrées pour la série ici. Vous pouvez afficher le texte intégral et les captures d'écran de ses pseudo-éléments vidéo correspondants. Bienvenue dans notre série Atoz CSS! Dans cette série, j'explorerai diverses valeurs (et propriétés) de CSS qui commencent par différentes lettres dans l'alphabet. Nous savons que parfois les captures d'écran ne suffisent pas, donc dans cet article, nous avons ajouté un nouveau conseil sur l'espace réservé de style. P signifie texte d'espace réservé Pseudo-éléments: avant et: après sont parfaits pour construire des fonctionnalités de conception complexes sans gâcher les étiquettes avec des éléments non sémantiques. Autres pseudo-éléments tels que: première ligne et: fi
- tutoriel CSS . interface Web 707 2025-02-20 11:29:09
-
- Angles inclinés dans le sass
- Cet article explore la création d'angles inclinés dans CSS à l'aide de SASS, offrant une solution sophistiquée qui évite les limites d'autres méthodes. Au lieu d'utiliser des images codées Base64, des pseudo-éléments asymétriques ou la bibliothèque des bords angulaires, cette approche
- tutoriel CSS . interface Web 589 2025-02-20 10:59:10
-
- Comment centrer verticalement le texte et les icônes dans CSS
- Cet article introduira une variété de méthodes de centrage horizontales et verticales CSS qui étaient autrefois difficiles mais qui sont désormais faciles à mettre en œuvre. Nous couvrirons le centrage horizontal et vertical à l'aide de Flexbox et de positionnement plus transformations. Dans un autre article, nous couvrirons également la façon d'utiliser la grille CSS pour un centrage horizontal et vertical. Résumé des points clés Utilisez Flexbox pour centrer verticalement le texte et les icônes: convertissez les conteneurs dans des conteneurs Flex et utilisez des éléments justifiés et alignant les éléments enfants centrés. La combinaison de la position et de la transformation peut atteindre un centrage vertical, en particulier pour les éléments très variables. Cela se fait en créant un contexte de positionnement et en ajustant la position de l'élément par rapport à son conteneur.
- tutoriel CSS . interface Web 671 2025-02-20 10:50:11
-
- ATOZ CSS Astuce rapide: flottants et éléments clairs et centrés
- SITEPOINT Premium Adhip Exclusive: Complete ATZ: CSS Series Tutorials! Chargement du joueur… Bienvenue à nos tutoriels de la série AToz CSS! Dans cette série de tutoriels, nous explorerons diverses valeurs (et propriétés) de CSS qui commencent par différentes lettres dans l'alphabet. Dans cet article, j'ai ajouté un astuce / cours rapide sur les attributs de flotteur et de clairs et diverses méthodes de centrage des éléments. F signifie flotteur et clair Floating est utile si vous souhaitez déplacer des éléments vers la gauche ou la droite de la page, mais malheureusement, vous ne pouvez pas utiliser Float: Centre pour centrer l'élément. N'est-ce pas très gênant? Ne vous inquiétez pas, voici les méthodes de centrage de divers éléments. Conseils 1
- tutoriel CSS . interface Web 902 2025-02-20 10:34:11
-
- Rendre les formulaires amusants avec Flexbox
- Utilisation de Flexbox pour une conception de formulaire HTML élégante et réactive Avantages clés de Flexbox dans la conception de la forme: CSS Flexbox propose une approche rationalisée à la disposition du formulaire HTML, résolvant des défis communs comme l'ordre de champ d'étiquettes incohérent et l'alignement
- tutoriel CSS . interface Web 231 2025-02-20 10:20:11
-
- ATOZ CSS Screencast: Unicode Range et @ FONT-FACE
- Résumé des points clés La règle CSS @ FONT-FACE permet d'utiliser des polices personnalisées dans la conception Web, améliorant ainsi les performances et améliorant la typographie. Assurez-vous de tester ces polices personnalisées sur différents systèmes d'exploitation et navigateurs pour vous assurer qu'ils apparaissent correctement. La propriété Unicode-Range de CSS peut être utilisée pour limiter la plage de caractères des applications de police personnalisées. Ceci est particulièrement utile pour ajouter des caractères ou des symboles spéciaux directement à la balise, ou en utilisant des polices spéciales pour des caractères spécifiques. En utilisant la propriété Unicode-Range, vous pouvez améliorer les performances de la page Web en vous assurant que seuls les caractères nécessaires sont téléchargés et utilisés, réduisant ainsi la quantité de données qui doivent être chargées. Cependant, il convient de noter que tous les navigateurs ne soutiennent pas cela
- tutoriel CSS . interface Web 981 2025-02-20 10:12:09
-
- Il est temps d'être honnête à propos des techniques de remplacement d'image
- Principaux à retenir Les techniques de remplacement d'images, autrefois populaires pour transmettre du contenu textuel sous une forme artistique tout en maintenant l'accessibilité, sont désormais souvent critiquées en raison de la disponibilité d'outils modernes tels que des polices personnalisées et de puissants outils CSS.
- tutoriel CSS . interface Web 386 2025-02-20 09:06:09
-
- ATOZ CSS: Création de design réactif avec les requêtes multimédias
- Points clés Évitez d'utiliser des points d'arrêt spécifiques à l'appareil lors de la création de conceptions réactives. Au lieu de cela, définissez les principaux points d'arrêt et les points de réglage fins secondaires qui sont approximativement de la taille de la plupart des téléphones, tablettes et périphériques de bureau / ordinateur portable. Utilisez EM ou REM comme unités de point d'arrêt, plutôt que des pixels, pour une meilleure évolutivité. Cela vous aidera si l'utilisateur à l'échelle de la page ou augmente la taille du texte. Les requêtes MEDIA CSS sont un outil puissant pour créer des conceptions réactives. Ils vous permettent d'appliquer différents styles à différents appareils avec différentes tailles d'écran. Cependant, évitez de les utiliser pour localiser des appareils spécifiques, car cela peut entraîner un cauchemar de maintenance. Au lieu de cela, concentrez-vous sur la création de conceptions réactives qui fonctionnent pour toutes les tailles d'écran. Cet article est atoz cs
- tutoriel CSS . interface Web 705 2025-02-20 08:47:10
-
- ATOZ CSS Screencast: le Rotatey CSS se transforme
- Ce didacticiel explore la transformation Rotatey de CSS, permettant des rotations 3D autour de l'axe des y, parfaites pour des effets tels que les flips de carte. Nous couvrirons également le style transform: Preserve-3D pour un rendu 3D approprié et la perspective et les propriétés d'origine perspective
- tutoriel CSS . interface Web 435 2025-02-20 08:40:09
Articles recommandés
Recommandations d'outils
Code de contact du formulaire de message d'entreprise jQuery
Le code de contact du formulaire de message d'entreprise jQuery est un formulaire de message d'entreprise simple et pratique et le code de la page d'introduction contactez-nous.
bouton de formulaire
2024-02-29
Effets de lecture de boîte à musique HTML5 MP3
L'effet spécial de lecture de boîte à musique HTML5 MP3 est un lecteur de musique MP3 basé sur HTML5 + CSS3 pour créer de jolies émoticônes de boîte à musique et cliquer sur le bouton de commutation.
Effets spéciaux du joueur
2024-02-29
Effets spéciaux du menu de navigation d'animation de particules cool HTML5
L'effet de menu de navigation d'animation de particules cool HTML5 est un effet spécial qui change de couleur lorsque le menu de navigation est survolé par la souris.
Navigation dans les menus
2024-02-29
Code d'édition par glisser-déposer du formulaire visuel jQuery
Le code d'édition par glisser-déposer du formulaire visuel jQuery est un formulaire visuel basé sur jQuery et le framework bootstrap.
bouton de formulaire
2024-02-29
Modèle Web de fournisseur de fruits et légumes biologiques Bootstrap5
Un modèle Web de fournisseur de fruits et légumes biologiques-Bootstrap5
Modèle d'amorçage
2023-02-03
Modèle de page Web réactive de gestion d'arrière-plan d'informations de données multifonctionnelles Bootstrap3-Novus
Modèle de page Web réactive de gestion d'arrière-plan d'informations de données multifonctionnelles Bootstrap3-Novus
modèle de back-end
2023-02-02
Modèle de page Web de plate-forme de services de ressources immobilières Bootstrap5
Modèle de page Web de plate-forme de services de ressources immobilières Bootstrap5
Modèle d'amorçage
2023-02-02
Modèle Web d'informations de CV simples Bootstrap4
Modèle Web d'informations de CV simples Bootstrap4
Modèle d'amorçage
2023-02-02
Matériau vectoriel d'éléments d'été mignons (EPS+PNG)
Il s'agit d'un joli matériau vectoriel d'éléments d'été, comprenant le soleil, un chapeau de soleil, un cocotier, un bikini, un avion, une pastèque, une crème glacée, une boisson fraîche, une bouée, des tongs, un ananas, une conque, une coquille, une étoile de mer, un crabe. , Citrons, crème solaire, lunettes de soleil, etc., le matériel est fourni aux formats EPS et PNG, y compris des aperçus JPG.
Matériau PNG
2024-05-09
Matériel vectoriel de quatre badges de graduation rouges 2023 (AI+EPS+PNG)
Il s'agit d'un matériau vectoriel de badge de remise des diplômes rouge 2023, quatre au total, disponible aux formats AI, EPS et PNG, y compris l'aperçu JPG.
Matériau PNG
2024-02-29
Oiseau chantant et chariot rempli de fleurs design matériel vectoriel de bannière de printemps (AI + EPS)
Il s'agit d'un matériau vectoriel de bannière printanière conçu avec des oiseaux chanteurs et un chariot rempli de fleurs. Il est disponible aux formats AI et EPS, y compris l'aperçu JPG.
image de bannière
2024-02-29
Matériau vectoriel de chapeau de graduation doré (EPS+PNG)
Il s'agit d'un matériau vectoriel de casquette de graduation dorée, disponible aux formats EPS et PNG, y compris l'aperçu JPG.
Matériau PNG
2024-02-27
Modèle de site Web d'entreprise de services de nettoyage et de réparation de décoration intérieure
Le modèle de site Web d'entreprise de services de nettoyage et d'entretien de décoration d'intérieur est un modèle de site Web à télécharger adapté aux sites Web promotionnels qui proposent des services de décoration, de nettoyage, d'entretien et d'autres organisations de services. Astuce : Ce modèle appelle la bibliothèque de polices Google et la page peut s'ouvrir lentement.
Modèle frontal
2024-05-09
Modèle de page de guide de CV personnel aux couleurs fraîches
Le modèle de page de guide de CV de candidature personnelle de correspondance de couleurs fraîches est un téléchargement de modèle Web de page de guide d'affichage de travail de CV de recherche d'emploi personnel adapté au style de correspondance de couleurs fraîches. Astuce : Ce modèle appelle la bibliothèque de polices Google et la page peut s'ouvrir lentement.
Modèle frontal
2024-02-29
Modèle Web de CV de travail créatif de concepteur
Le modèle Web de CV de travail créatif de concepteur est un modèle Web téléchargeable pour l'affichage de CV personnels adapté à divers postes de concepteur. Astuce : Ce modèle appelle la bibliothèque de polices Google et la page peut s'ouvrir lentement.
Modèle frontal
2024-02-28
Modèle de site Web d'entreprise de construction d'ingénierie moderne
Le modèle de site Web d'entreprise d'ingénierie et de construction moderne est un modèle de site Web téléchargeable adapté à la promotion du secteur des services d'ingénierie et de construction. Astuce : Ce modèle appelle la bibliothèque de polices Google et la page peut s'ouvrir lentement.
Modèle frontal
2024-02-28
