Le dernier didacticiel vidéo CSS3 sur le code source de Han Shunping

"Le dernier didacticiel vidéo CSS3 de Han Shunping 2016" est une explication technique de la nouvelle technologie CSS, CSS3, qui est mise à niveau sur la base de la technologie CSS2 pour obtenir de meilleurs résultats. CSS3 est une version améliorée de la technologie CSS, et le développement du langage CSS3 évolue vers la modularité. Décomposez-le en modules plus petits. Ces modules incluent : modèle de boîte, module de liste, méthode de lien hypertexte, module de langue, arrière-plan et bordure, effets de texte, mise en page multi-colonnes, etc.

Adresse de lecture du cours : //m.sbmmt.com/course/441.html

Le style d'enseignement du professeur :

Les cours du professeur sont vivants, pleins d'esprit, pleins d'esprit et touchants. Une métaphore vivante est comme la touche finale, ouvrant la porte à la sagesse aux étudiants ; un humour bien placé apporte un sourire entendu aux étudiants, comme boire un verre de vin moelleux, donnant aux gens un arrière-goût et une nostalgie des aphorismes d'un philosophe, des références culturelles. sont intercalés de temps en temps dans la narration, donnant aux gens réflexion et vigilance.

Le point le plus difficile dans cette vidéo est d'insérer des boîtes en ligne en CSS3 :

L'idée principale du mode de mise en page Flexbox introduit par CSS3 est de donner le conteneur a la possibilité d'activer ses sous-projets. Modifiez sa largeur et sa hauteur pour remplir au mieux l'espace disponible. Les conteneurs Flex utilisent des éléments Flex pour se développer et se contracter automatiquement afin de remplir l'espace libre disponible.
Plus important encore, la direction de la mise en page Flexbox est imprévisible, contrairement aux mises en page conventionnelles (niveau bloc de haut en bas, en ligne de gauche à droite), qui conviennent à la mise en page, mais ne conviennent pas à la prise en charge de grandes ou complexes. flexibilité.
Si la mise en page standard est basée sur la direction du flux de texte en bloc et en ligne, alors la mise en page Flex est basée sur la direction « Flex-flow ». Comprenons d’abord une terminologie particulière du modèle de boîte télescopique.

Spindle : L'axe principal du conteneur Flex est principalement utilisé pour configurer les projets Flex. Ce n'est pas forcément horizontal, cela dépend principalement de l'attribut fle-direction.
Point de départ de la broche, point final de l'axe principal : La configuration du projet Flex commence à partir du point de départ de l'axe principal du conteneur et se termine au point final de l'axe principal.
Longueur de l'axe principal : la largeur ou la hauteur du projet Flex dans la direction de l'axe principal est la longueur de l'axe principal du projet. L'attribut de longueur de l'axe principal du projet Flex est l'attribut de largeur ou de hauteur, lequel est déterminé par. lequel fait face à la direction de l’axe principal.
Axe latéral : L'axe perpendiculaire à l'axe principal est appelé axe latéral, qui est une extension de la direction de l'axe latéral.
Point de départ de l'axe transversal, point final de l'axe transversal : La configuration de la rangée télescopique commence au point de départ de l'axe transversal du conteneur et se termine au point final de l'axe transversal.
Longueur de l'axe transversal : la largeur ou la hauteur de l'élément Flex dans la direction de l'axe transversal est la longueur de l'axe transversal de l'élément. L'attribut de longueur de l'axe transversal de l'élément Flex est l'attribut de largeur ou de hauteur, selon la valeur. fait face à la direction de l’axe principal.

La spécification syntaxique de la mise en page Flex a beaucoup changé au fil des ans, ce qui a également apporté certaines limitations à l'utilisation de Flexbox. En raison de la présence de nombreuses versions de la spécification syntaxique et de la prise en charge incohérente du navigateur, la mise en page Flexbox ne l'est pas. beaucoup utilisé. Les spécifications de syntaxe de mise en page Flexbox sont principalement divisées en trois types.

Ici, nous vous recommandons également de télécharger les ressources du code source : //m.sbmmt.com/xiazai/learn/2127

Les ressources sont partagées avec vous. didacticiel et code source

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!