Black Friday Sale! Save up to 50% off!

Comment utiliser l'élément Grid pour créer des sites Web réactifs

La grille est un élément conteneur que vous pouvez utiliser pour placer des éléments de page Web dans des cellules. Nous vous recommandons d'utiliser l'élément Grid, car il convient aux conceptions réactives, car les cellules se déplacent automatiquement les unes sous les autres sur des écrans plus petits.
Élément de grille Comment utiliser l'élément Grid pour créer des sites Web réactifs

Parcourir par catégories de fonctionnalités

Redimensionner les cellules de la grille

Si vous avez besoin de créer des mises en page sophistiquées pour vos images, formes et textes, vous pouvez redimensionner les cellules de la grille de différentes largeurs pour donner à vos conceptions un aspect moderne.

Déplacer les cellules de la grille

Les grilles permettent d'organiser divers contenus, y compris des images, des icônes, des formes et du texte sous forme de cellules, qui sont très pratiques à utiliser. Dans notre éditeur visuel, vous pouvez facilement déplacer des cellules dans une grille en faisant simplement glisser une cellule sur une autre, en perfectionnant votre mise en page et votre contenu pour votre conception Web. De plus, vous pouvez cliquer sur les icônes fléchées de l'outil contextuel de la cellule pour déplacer la cellule.

Espace entre les cellules de la grille

Vous pouvez modifier l'espacement entre les cellules de la grille en fonction de vos exigences de conception Web. Pour cela, vous pouvez utiliser la propriété Cell Gap dans le panneau de propriétés. Sélectionnez une grille, puis accédez au panneau de propriétés, faites défiler le panneau, faites glisser le curseur pour modifier l'écart.

Modifier la disposition de la grille

Vous pouvez modifier la disposition de la grille ajoutée en bloc à tout moment. Sélectionnez l'élément de grille, puis accédez au panneau de propriétés. Cliquez sur la flèche pour ouvrir la liste des préréglages de grille et sélectionnez la mise en page qui convient le mieux à votre idée de conception Web. Vous pouvez également ajouter et supprimer des cellules de grille dans l'éditeur.

Grille en boîte et large

Vous pouvez facilement changer la largeur de la grille de Boxed à Wide et vice versa. Sélectionnez une grille, puis accédez au panneau de propriétés. Localisez l'icône Boxed/Wide près des valeurs de largeur et de hauteur, et modifiez la disposition de la ceinture en cliquant sur cette icône.

Basculement de la disposition de la grille

L'élément Grid est très flexible. Vous pouvez ajuster sa mise en page aux exigences de votre idée de conception de sites Web. Pour retourner la Grille que vous avez placée dans un Bloc. Sélectionnez cet élément, puis accédez au panneau de propriétés à droite. Cliquez sur la liste déroulante Retourner près de la disposition de la grille. Cliquez sur Retourner ou Rotation pour effectuer l'opération.

Type d'arrière-plan de cellule de grille

Une cellule de l'élément de grille peut avoir un arrière-plan et vous pouvez utiliser différents types pour cela. Vous pouvez appliquer le remplissage de couleur, le dégradé, l'image, la vidéo ou ne pas avoir d'arrière-plan du tout. Sélectionnez une cellule de grille et accédez au panneau de propriétés. Choisissez un type d'arrière-plan qui convient le mieux à votre conception Web.

Grille en modes réactifs

Les éléments de la grille sont très utiles pour créer des modes réactifs, car dans les écrans plus petits, les cellules de la grille se déplacent automatiquement les unes sous les autres. De plus, pour de nombreuses mises en page, vous pouvez modifier l'ordre des cellules de la grille sur toutes les vues mobiles. Choisissez l'élément de grille, basculez le mode réactif sur la barre supérieure, ajustez votre grille, si nécessaire. Pour la plupart des grilles, vous n'avez pas besoin de faire des ajustements.

Passez le curseur sur une cellule de la grille

L'animation Slider est une réaction très populaire sur Hover. Vous pouvez ajouter divers effets pour les cellules de la grille, par exemple, Fade, Overlay, Slide, Flip, Wobble et Zoom. Sélectionnez une cellule de grille, puis accédez au panneau de propriétés. Cliquez sur le lien Hover Slide, puis choisissez l'effet que vous souhaitez voir sur le Hover de la Grid Cell.

Plus de 80 dispositions de grille

Obtenez la plus grande variété de mises en page de grille pour votre conception Web. Les éléments de grille vous aident à rendre automatiquement vos conceptions adaptées aux mobiles.

Grille pour appareils mobiles

Utilisez l'élément de grille pour créer facilement les modes réactifs. Sur les petits écrans, les cellules de la grille se déplacent automatiquement les unes sous les autres.

Modèles gratuits avec Élément de grille

Commencez avec nos meilleurs modèles, parfaits pour toute entreprise. Créez et personnalisez-les avec notre créateur de site Web puissant et gratuit sans code. Tous les modèles sont adaptés aux mobiles et ont fière allure sur n'importe quel appareil.

Using the Grid Element In The Website Creation

Our Grid element provides a cell container where you can place other elements you wish to demonstrate in a very compact and user-friendly interface that will look great on any device, whether PC, Mac, or mobile device. After adding the elements, you can also pick a color palette, the size of the cells and change their positioning quickly, simply, and very effectively. Using the responsive grid element, you can create a great beautiful blog-ish interface with any color palette or use our modern templates for a quick creation. Sign up to our news emailing to get several update letters per month about new unique possibilities in web creation.

Similar to the confirmations of co-founder Brian Axe chairman & Dan Tocchini founder, modern grid uses artificial intelligence and can keep expectations clear about how the new engine hums. CEO Dan Tocchini and Brian Axe also talk about how close a grid ai-powered website builder will be to Google AdSense. Years ago, CEO and co-founder Dan launched a crowdfunding campaign to create artificial intelligence for design. Tocchini CEO and co-founder also noticed how game-changing yada yada new engine will be and how close the product will satisfy suits. Through this talk talk talk of how close a crowdfunding campaign through those years went into some uber-regular with life-is-swell emails at times, but only 8 per month got a full dose of funding required for the project.

Dan Tocchini and companions, shipping the viable shells to their content user now and then in the form of uber-regular or life-is-swell emails, back up their content and provide a full dose until their new engine satisfies suits and simple users who want to experience ai-powered website builder with game-changing yada yada. Viable shells can be promoted through uber-regular or life-is-swell emails and keep us with full dose till the release of the product.