Test page - Revision history

PalkóÁron at 14:35, 20 February 2024

2024-02-20T14:35:07Z

Palkó.Gábor at 16:22, 15 February 2024

2024-02-15T16:22:27Z

Palkó.Gábor at 18:16, 13 February 2024

2024-02-13T18:16:56Z

Palkó.Gábor at 18:11, 13 February 2024

2024-02-13T18:11:27Z

Palkó.Gábor at 18:08, 13 February 2024

2024-02-13T18:08:12Z

Palkó.Gábor: Replaced content with "
2024-02-13T18:02:12Z

Replaced content with "<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius:..."

← Older revision Revision as of 18:02, 13 February 2024
Line 2: Line 2:

<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>

<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>

−
<div class="limit-line-length">

−
'''Diese Seite zeigt einige Formatierungen, die dank der [https://www.mediawiki.org/wiki/Extension:TemplateStyles TemplateStyles-Erweiterung] möglich werden.''' Das zugehörige Stylesheet findet sich unter [[Vorlage:TemplateStyles/styles.css]]. Es wird wie folgt eingebunden:

−

−
<syntaxhighlight lang="html">

−
<templatestyles src="TemplateStyles/styles.css" />

−
</syntaxhighlight>

−
<templatestyles src="TemplateStyles/styles.css" />

−

−
<hr>

−

−

−
==Indirekte Anordnung von Unterelementen==

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−

−
<div class="in-row">

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−
</div>

−

−
<syntaxhighlight lang="html">

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−

−
<div class="in-row">

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−

−
<div class="box">

−
Dies ist ein Beispieltext.

−
</div>

−
</div>

−
</syntaxhighlight>

−

−
==Indirekte Formatierung von Links==

−
<div class="in-row">

−
<div class="box">

−
Dies ist ein Beispieltext mit einem [[Wikilink]].

−
</div>

−

−
<div class="box negativ">

−
Dies ist ein Beispieltext mit einem [[Wikilink]].

−
</div>

−
</div>

−

−
<syntaxhighlight lang="html">

−
<div class="in-row">

−
<div class="box">

−
Dies ist ein Beispieltext mit einem [[Wikilink]].

−
</div>

−

−
<div class="box negativ">

−
Dies ist ein Beispieltext mit einem [[Wikilink]].

−
</div>

−
</div>

−
</syntaxhighlight>

−

−
==Fluide Bildgrößen==

−
Zum Testen Broswerfenster skalieren. Bild wird immer auf die zur Verfügung stehende Breite skaliert.

−
<div class="in-row">

−
<div class="full-box fluid-image">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
<div class="full-box fluid-image">[[File:MK 0461-0481 Kurhaus Wiesbaden.jpg|800px]]</div>

−
<div class="full-box fluid-image">[[File:MK53831-32_Palais_des_Papes_d'Avignon.jpg|800px]]</div>

−
</div>

−

−
<syntaxhighlight lang="html">

−
<div class="in-row">

−
<div class="full-box fluid-image">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
<div class="full-box fluid-image">[[File:MK 0461-0481 Kurhaus Wiesbaden.jpg|800px]]</div>

−
<div class="full-box fluid-image">[[File:MK53831-32_Palais_des_Papes_d'Avignon.jpg|800px]]</div>

−
</div>

−
</syntaxhighlight>

−

−
<div class="in-row">

−
<div class="full-box fluid-image" style="width:30%">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
<div class="full-box fluid-image" style="width:20%">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
<div class="full-box fluid-image" style="width:13.3%">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
<div class="full-box fluid-image" style="width:8.8%">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
</div>

−

−
<syntaxhighlight lang="html">

−
<div class="in-row">

−
<div class="full-box fluid-image" style="width:30%">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
<div class="full-box fluid-image" style="width:20%">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
<div class="full-box fluid-image" style="width:13.3%">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
<div class="full-box fluid-image" style="width:8.8%">[[File:MK17998 Lincoln Cathedral.jpg|800px]]</div>

−
</div>

−
</syntaxhighlight>

−

−
==Breakpoints==

−
Aussehen ändert sich abhängig von der Viewport-Größe. Zum Testen Broswerfenster skalieren.

−

−
<div class="box full-width-small-down float-right-medium-up">

−
Dies ist ein Beispieltext mit einem [[Wikilink]].

−
</div>

−
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

−

−
<syntaxhighlight lang="html">

−
<div class="box full-width-small-down float-right-medium-up">

−
Dies ist ein Beispieltext mit einem [[Wikilink]].

−
</div>

−
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

−
</syntaxhighlight>

−

−
</div>

Palkó.Gábor at 17:55, 13 February 2024

2024-02-13T17:55:47Z

Palkó.Gábor at 17:48, 13 February 2024

2024-02-13T17:48:17Z

Palkó.Gábor at 17:45, 13 February 2024

2024-02-13T17:45:46Z

Palkó.Gábor: Created page with "

← Older revision		Revision as of 16:22, 15 February 2024
Line 1:		Line 1:
	{{Kasinet_header}}		{{Kasinet_header}}
		+
		+
		+
		+
		+
		+
		+

	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;">Click me</span>		<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;">Click me</span>

@@ Line 7: / Line 7: @@
 <div style="position: relative; display: inline-block;">
-   <button style="background-color: #4CAF50; color: white; padding: 10px; font-size: 16px; border: none; cursor: pointer;">Dropdown</button>
+   <span style="background-color: #4CAF50; color: white; padding: 10px; font-size: 16px; border: none; cursor: pointer;">Dropdown</span>
    <div style="display: none; position: absolute; background-color: #f9f9f9; min-width: 160px; box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2); z-index: 1;">
      <a href="#" style="color: black; padding: 10px; text-decoration: none; display: block;">Link 1</a>

← Older revision		Revision as of 18:11, 13 February 2024
Line 4:		Line 4:

	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>		<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>
		+
		+
		+	<div style="position: relative; display: inline-block;">
		+	<button style="background-color: #4CAF50; color: white; padding: 10px; font-size: 16px; border: none; cursor: pointer;">Dropdown</button>
		+	<div style="display: none; position: absolute; background-color: #f9f9f9; min-width: 160px; box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2); z-index: 1;">
		+	<a href="#" style="color: black; padding: 10px; text-decoration: none; display: block;">Link 1</a>
		+	<a href="#" style="color: black; padding: 10px; text-decoration: none; display: block;">Link 2</a>
		+	<a href="#" style="color: black; padding: 10px; text-decoration: none; display: block;">Link 3</a>
		+	</div>
		+	</div>

← Older revision		Revision as of 18:08, 13 February 2024
Line 1:		Line 1:
		+	{{Kasinet_header}}
		+
	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;">Click me</span>		<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;">Click me</span>

	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>		<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>

← Older revision		Revision as of 17:48, 13 February 2024
Line 1:		Line 1:
	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;">Click me</span>		<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;">Click me</span>
		+
		+	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>

← Older revision		Revision as of 14:35, 20 February 2024
Line 1:		Line 1:
	{{Kasinet_header}}		{{Kasinet_header}}
−
−
−
−
−
−
−

	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;">Click me</span>		<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;">Click me</span>

← Older revision		Revision as of 18:02, 13 February 2024
Line 2:		Line 2:

	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>		<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>
−	~~<div class="limit-line-length">~~
−	'''Diese Seite zeigt einige Formatierungen, die dank der [https://www.mediawiki.org/wiki/Extension:TemplateStyles TemplateStyles-Erweiterung] möglich werden.''' Das zugehörige Stylesheet findet sich unter [[Vorlage:TemplateStyles/styles.css]]. Es wird wie folgt eingebunden:
−
−	~~<syntaxhighlight lang="html">~~
−	~~<templatestyles src="TemplateStyles/styles.css" />~~
−	~~</syntaxhighlight>~~
−	~~<templatestyles src="TemplateStyles/styles.css" />~~
−
−	~~<hr>~~
−
−
−	~~==Indirekte Anordnung von Unterelementen==~~
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−
−	~~<div class="in-row">~~
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−	~~</div>~~
−
−	~~<syntaxhighlight lang="html">~~
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−
−	~~<div class="in-row">~~
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext.~~
−	~~</div>~~
−	~~</div>~~
−	~~</syntaxhighlight>~~
−
−	~~==Indirekte Formatierung von Links==~~
−	~~<div class="in-row">~~
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext mit einem [[Wikilink]].~~
−	~~</div>~~
−
−	~~<div class="box negativ">~~
−	~~Dies ist ein Beispieltext mit einem [[Wikilink]].~~
−	~~</div>~~
−	~~</div>~~
−
−	~~<syntaxhighlight lang="html">~~
−	~~<div class="in-row">~~
−	~~<div class="box">~~
−	~~Dies ist ein Beispieltext mit einem [[Wikilink]].~~
−	~~</div>~~
−
−	~~<div class="box negativ">~~
−	~~Dies ist ein Beispieltext mit einem [[Wikilink]].~~
−	~~</div>~~
−	~~</div>~~
−	~~</syntaxhighlight>~~
−
−	~~==Fluide Bildgrößen==~~
−	~~Zum Testen Broswerfenster skalieren. Bild wird immer auf die zur Verfügung stehende Breite skaliert.~~
−	~~<div class="in-row">~~
−	~~<div class="full-box fluid-image">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image">[[File:MK 0461-0481 Kurhaus Wiesbaden.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image">[[File:MK53831-32_Palais_des_Papes_d'Avignon.jpg\|800px]]</div>~~
−	~~</div>~~
−
−	~~<syntaxhighlight lang="html">~~
−	~~<div class="in-row">~~
−	~~<div class="full-box fluid-image">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image">[[File:MK 0461-0481 Kurhaus Wiesbaden.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image">[[File:MK53831-32_Palais_des_Papes_d'Avignon.jpg\|800px]]</div>~~
−	~~</div>~~
−	~~</syntaxhighlight>~~
−
−	~~<div class="in-row">~~
−	~~<div class="full-box fluid-image" style="width:30%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image" style="width:20%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image" style="width:13.3%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image" style="width:8.8%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~</div>~~
−
−	~~<syntaxhighlight lang="html">~~
−	~~<div class="in-row">~~
−	~~<div class="full-box fluid-image" style="width:30%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image" style="width:20%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image" style="width:13.3%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~<div class="full-box fluid-image" style="width:8.8%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>~~
−	~~</div>~~
−	~~</syntaxhighlight>~~
−
−	~~==Breakpoints==~~
−	~~Aussehen ändert sich abhängig von der Viewport-Größe. Zum Testen Broswerfenster skalieren.~~
−
−	~~<div class="box full-width-small-down float-right-medium-up">~~
−	~~Dies ist ein Beispieltext mit einem [[Wikilink]].~~
−	~~</div>~~
−	Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
−
−	~~<syntaxhighlight lang="html">~~
−	~~<div class="box full-width-small-down float-right-medium-up">~~
−	~~Dies ist ein Beispieltext mit einem [[Wikilink]].~~
−	~~</div>~~
−	Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
−	~~</syntaxhighlight>~~
−
−	~~</div>~~

← Older revision		Revision as of 17:55, 13 February 2024
Line 2:		Line 2:

	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>		<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;" onclick="window.open('https://example.com', '_blank');">Click me</span>
		+	<div class="limit-line-length">
		+	'''Diese Seite zeigt einige Formatierungen, die dank der [https://www.mediawiki.org/wiki/Extension:TemplateStyles TemplateStyles-Erweiterung] möglich werden.''' Das zugehörige Stylesheet findet sich unter [[Vorlage:TemplateStyles/styles.css]]. Es wird wie folgt eingebunden:
		+
		+	<syntaxhighlight lang="html">
		+	<templatestyles src="TemplateStyles/styles.css" />
		+	</syntaxhighlight>
		+	<templatestyles src="TemplateStyles/styles.css" />
		+
		+	<hr>
		+
		+
		+	==Indirekte Anordnung von Unterelementen==
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+
		+	<div class="in-row">
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+	</div>
		+
		+	<syntaxhighlight lang="html">
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+
		+	<div class="in-row">
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+
		+	<div class="box">
		+	Dies ist ein Beispieltext.
		+	</div>
		+	</div>
		+	</syntaxhighlight>
		+
		+	==Indirekte Formatierung von Links==
		+	<div class="in-row">
		+	<div class="box">
		+	Dies ist ein Beispieltext mit einem [[Wikilink]].
		+	</div>
		+
		+	<div class="box negativ">
		+	Dies ist ein Beispieltext mit einem [[Wikilink]].
		+	</div>
		+	</div>
		+
		+	<syntaxhighlight lang="html">
		+	<div class="in-row">
		+	<div class="box">
		+	Dies ist ein Beispieltext mit einem [[Wikilink]].
		+	</div>
		+
		+	<div class="box negativ">
		+	Dies ist ein Beispieltext mit einem [[Wikilink]].
		+	</div>
		+	</div>
		+	</syntaxhighlight>
		+
		+	==Fluide Bildgrößen==
		+	Zum Testen Broswerfenster skalieren. Bild wird immer auf die zur Verfügung stehende Breite skaliert.
		+	<div class="in-row">
		+	<div class="full-box fluid-image">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	<div class="full-box fluid-image">[[File:MK 0461-0481 Kurhaus Wiesbaden.jpg\|800px]]</div>
		+	<div class="full-box fluid-image">[[File:MK53831-32_Palais_des_Papes_d'Avignon.jpg\|800px]]</div>
		+	</div>
		+
		+	<syntaxhighlight lang="html">
		+	<div class="in-row">
		+	<div class="full-box fluid-image">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	<div class="full-box fluid-image">[[File:MK 0461-0481 Kurhaus Wiesbaden.jpg\|800px]]</div>
		+	<div class="full-box fluid-image">[[File:MK53831-32_Palais_des_Papes_d'Avignon.jpg\|800px]]</div>
		+	</div>
		+	</syntaxhighlight>
		+
		+	<div class="in-row">
		+	<div class="full-box fluid-image" style="width:30%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	<div class="full-box fluid-image" style="width:20%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	<div class="full-box fluid-image" style="width:13.3%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	<div class="full-box fluid-image" style="width:8.8%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	</div>
		+
		+	<syntaxhighlight lang="html">
		+	<div class="in-row">
		+	<div class="full-box fluid-image" style="width:30%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	<div class="full-box fluid-image" style="width:20%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	<div class="full-box fluid-image" style="width:13.3%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	<div class="full-box fluid-image" style="width:8.8%">[[File:MK17998 Lincoln Cathedral.jpg\|800px]]</div>
		+	</div>
		+	</syntaxhighlight>
		+
		+	==Breakpoints==
		+	Aussehen ändert sich abhängig von der Viewport-Größe. Zum Testen Broswerfenster skalieren.
		+
		+	<div class="box full-width-small-down float-right-medium-up">
		+	Dies ist ein Beispieltext mit einem [[Wikilink]].
		+	</div>
		+	Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
		+
		+	<syntaxhighlight lang="html">
		+	<div class="box full-width-small-down float-right-medium-up">
		+	Dies ist ein Beispieltext mit einem [[Wikilink]].
		+	</div>
		+	Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
		+	</syntaxhighlight>
		+
		+	</div>

← Older revision		Revision as of 17:45, 13 February 2024
Line 1:		Line 1:
−	<style>	+	<span style="display: inline-block; padding: 10px 20px; background-color: #4CAF50; color: white; text-align: center; text-decoration: none; font-size: 16px; border-radius: 5px; border: none; cursor: pointer;">Click me</span>
−	~~.button {~~
−	display: inline-block;
−	padding: 10px 20px;
−	background-color: #4CAF50;
−	color: white;
−	text-align: center;
−	text-decoration: none;
−	font-size: 16px;
−	border-radius: 5px;
−	border: none;
−	cursor: pointer;
−	}
−	~~</style>~~
−	~~<span class="button~~">Click me</span>