Considérez chaque quatre cercles comme les quatre sommets d'un rectangle, et les lignes pointillées peuvent être implémentées en utilisant des pointillés de style bordure.
Ensuite, la page entière est empilée verticalement un par un comme ce rectangle. Deux sommets sont placés dans chaque rectangle, et ils sont positionnés de manière absolue dans le coin supérieur gauche et le coin supérieur droit du rectangle.
Il n'y a pas de relation progressive purement horizontale et verticale, cela semble très gênant. La relation entre chaque couche n'est pas liée par des pointeurs mais en regardant le nombre d'étapes ci-dessous. Mauvaise critique. Et il y a deux descriptions de processus avec un fond sombre, mais je ne connais pas l'intention L'expérience globale est trop mauvaise, surtout le processus est trop étroit, ce qui affecte l'attention de l'utilisateur.
width || height : calc calcule dynamiquement la largeur de la ligne. Cette ligne noire peut utiliser des pseudo-éléments, ::before ::after, leurs classes parents sont toutes des éléments hôtes. Je pense que le canevas est un peu excessif, et cela peut l'être. réalisé avec CSS.
1. Découper avec des images est une façon. 2. Ou utilisez le p supplémentaire de la mise en page pour le positionnement, et la bordure : 1px en pointillé #000 pour le style. . C'est ça. 3. Utilisez la pseudo-classe CSS pour implémenter.
Utilisez d'abord ul li float pour flotter, puis écrivez un class.bg{position:relitive}, écrivez deux pseudo-classes, à savoir des lignes horizontales et des lignes verticales, et positionnez-les selon le brouillon de conception
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Considérez chaque quatre cercles comme les quatre sommets d'un rectangle, et les lignes pointillées peuvent être implémentées en utilisant des pointillés de style bordure.
Ensuite, la page entière est empilée verticalement un par un comme ce rectangle. Deux sommets sont placés dans chaque rectangle, et ils sont positionnés de manière absolue dans le coin supérieur gauche et le coin supérieur droit du rectangle.
https://codepen.io/straybugs/…
Il n'y a pas de relation progressive purement horizontale et verticale, cela semble très gênant.
La relation entre chaque couche n'est pas liée par des pointeurs mais en regardant le nombre d'étapes ci-dessous. Mauvaise critique.
Et il y a deux descriptions de processus avec un fond sombre, mais je ne connais pas l'intention
L'expérience globale est trop mauvaise, surtout le processus est trop étroit, ce qui affecte l'attention de l'utilisateur.
image-de-fond
toile
pseudo-classe
Si la largeur est fixe, je pourrais jeter les lignes en arrière-plan, hahaha
width || height : calc calcule dynamiquement la largeur de la ligne. Cette ligne noire peut utiliser des pseudo-éléments, ::before ::after, leurs classes parents sont toutes des éléments hôtes. Je pense que le canevas est un peu excessif, et cela peut l'être. réalisé avec CSS.
1. Découper avec des images est une façon.
2. Ou utilisez le p supplémentaire de la mise en page pour le positionnement, et la bordure : 1px en pointillé #000 pour le style. . C'est ça.
3. Utilisez la pseudo-classe CSS pour implémenter.
S'il s'agit d'un navigateur après IE8, utilisez des pseudo-classes pour l'implémenter
S'il est compatible avec les navigateurs précédents, vous ne pouvez utiliser p que pour simuler une vague. Cela dépend de vos besoins personnels.
Soutenez les étudiants qui utilisent la toile, vous pouvez prendre du recul et utiliser des images pour découper des images.
Utilisez d'abord ul li float pour flotter, puis écrivez un class.bg{position:relitive}, écrivez deux pseudo-classes, à savoir des lignes horizontales et des lignes verticales, et positionnez-les selon le brouillon de conception