1. Zuhause
  2. Eigenschaften
  3. Webseitenelemente
  4. Grid-Repeater-Element
  5. Eigenschaften Von Spalten Und Zeilen

So ändern Sie die Spalten und Zeilen für das Grid Repeater-Element

Im Eigenschaftsfenster können Sie Elementeigenschaften ändern. Beispielsweise können Sie die Spalten und Zeilen an einer Stelle für den Grid Repeater ändern. Um die Spalten und Zeilen zu ändern, gehen Sie zu den Eigenschaftsfeldern und ziehen Sie die entsprechenden Schieberegler, um die Eigenschaftswerte zu ändern.
Mehr erfahren

Nach Funktionskategorien durchsuchen

Webseitenelemente
Unterstützte Systeme
Visueller Seiteneditor
Design-Elemente
Medienbibliotheken
Elementeigenschaften
Responsiv
Animationseffekte
Themen Einstellungen
Kontakt Formular
Kopfzeile Fußzeile
Blog
E-Commerce
SEO
Benutzerdefinierter Code
Anwendungsfunktionen
Site- und Seiteneigenschaften
WordPress-Widgets

Alles, was Sie brauchen, um Ihre kostenlose Website zu erstellen

Verwenden Sie unseren Website Builder, um Websites ohne Codierung zu entwerfen und zu erstellen. Ziehen Sie alles, was Sie möchten, per Drag & Drop an einen beliebigen Ort. Der Website Creator passt Ihre Website automatisch für Mobilgeräte an, um sie responsive zu machen. Wählen Sie aus mehr als 15,000 anpassbaren Website-Vorlagen.

Für Windows herunterladen Für Mac herunterladen

Verwandte Funktionen

Grid-Repeater zum Karussell

Karussell-Schieberegler sind im modernen Webdesign sehr beliebt, und normalerweise haben Karussellelemente das gleiche Layout und die gleichen Elementsätze. In Nicepage können Sie jeden Grid-Repeater ganz einfach in ein Karussell umwandeln, indem Sie im Eigenschaftsfenster auf die Switcher-Option klicken.
Mehrfachauswahl zum Grid-Repeater

Sie können mehrfach ausgewählte Elemente in einen Grid-Repeater umwandeln. Es beschleunigt die Entwicklung von Blöcken wie Features, Team, Testimonials usw. Wählen Sie mehrere Elemente aus und klicken Sie dann auf das blaue Plus-Symbol am linken Rand. Wählen Sie als Nächstes das Grid-Repeater-Layout aus.
Grid Repeater Elementfarben

Mit dem Grid-Repeater-Element können Sie seinen Items und enthaltenen Elementen unterschiedliche Farben zuweisen. Wechseln Sie dazu in das Eigenschaftsfenster und wechseln Sie im Abschnitt „Stil anwenden auf“ von „Alle Elemente“ zu „Element“. Stellen Sie dann die für Ihre Webdesign-Idee erforderlichen Farben ein
Zeilen zu Grid Repeater hinzufügen

Ähnlich wie beim Hinzufügen von Spalten können Sie die Anzahl der Zeilen erhöhen und verringern, indem Sie auf das blaue Plus-Symbol unten im Grid Repeater klicken. Nachdem Sie die Dropdown-Liste sehen, können Sie die Anzahl der erforderlichen Zeilen auswählen. Sie können sowohl inkrementierende als auch dekrementierende Zahlen auswählen.
Grid Repeater Item Gap

Mit der Eigenschaft Item Gap im Property Panel können Sie den Abstand zwischen Grid Repeater-Elementen ändern. Wählen Sie den Grid Repeater aus, gehen Sie zum Eigenschaftsfenster, suchen Sie die Eigenschaft Item Gap und ziehen Sie den Schieberegler, um den Abstand zwischen den Grid Repeater-Elementen zu ändern.
Spalten zum Grid-Repeater hinzufügen

Sie können die Anzahl der Spalten für den in einem Block verwendeten Grid Repeater einfach ändern. Klicken Sie auf das blaue Plus-Symbol auf der rechten Seite des Grid-Repeaters und wählen Sie dann die Anzahl der Spalten aus der Dropdown-Liste aus. Sie können sowohl inkrementierende als auch dekrementierende Zahlen auswählen.
Box-Hover-Animation für Grid-Repeater-Elemente

Ähnlich wie beim Gruppenelement können Sie Grid-Repeater-Elemente beim Group (Item) Hover animieren. Dabei können Sie auch den Hover-Animationseffekt zu Elementen hinzufügen, und sie werden zusammenarbeiten. Gehen Sie zum Eigenschaftenbereich, hinunter zum Abschnitt Animation ein, und stellen Sie bei Bedarf sowohl Hover- als auch Group Hover-Animationseffekte ein.

Kostenlose Vorlagen mit Grid-Repeater-Element

Beginnen Sie mit unseren besten Vorlagen, die sich für jedes Unternehmen eignen. Erstellen und passen Sie sie mit unserem leistungsstarken und kostenlosen Website-Builder ohne Code an. Alle Vorlagen sind mobilfreundlich und sehen auf jedem Gerät hervorragend aus.

How To Modify The Rows And Columns Properties For Grid Repeater Element

Our page builder uses the Grid system that allows the creation of a responsive design for the Grid layout on your page using the best practices of the Grids. Adjust the Grid layout web design on your web page using rows and columns. In our Property Panel, you can use smooth sliders to regulate the number of rows and columns, quickly adding or removing them. Using the Item Gap slider, you can customize the grid layout space between columns and rows so that the one column and row would be at an equivalent distance from one another. You can build your web design without a drag and drop editor or different types of grids using simple yet effective best practices.

Web designers usually wonder how to create a responsive grid and build grid systems that laconically combine the most important content of text and images? Using main types of grids like a modular grid or hierarchical grid, you can integrate more than 12 columns per page by changing their positioning in the grid system. The modular grid has a strict space between the gutters, but this plays as a plus for the responsive design in the content area. Hierarchical grids provide a more free website design where text and images are not always a part of the same block but create an overall complete structure.

For the 12 columns maximum, the most important thing is to manage the overall space between columns and column width within the 12-column grid. Our landing page builder will answer the question of how to create unique types of grids similar to a modular grid or hierarchical grid. Our page builder will help to customize the column width in your column grid and improve the user experience on different devices and screen sizes. A good user experience will prevent users from clicking the skip to content button, especially how to build a page in the 12 column grid.

Company
Product
Themes & Templates
Nicepage
Web Design