Widget:Teaser: Unterschied zwischen den Versionen
Aus MediaWiki
Die Seite wurde neu angelegt: „<includeonly> <style type="text/css"> .tiles-container { display: flex; justify-content: space-between; gap: 20px; } .tile { width: 30%; background-color: #f0f0f0; border-radius: 10px; padding: 15px; text-align: center; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); } .tile img { width: 100%; border-radius: 10px; margin-bottom: 10px; } .tile h3 { font-size: 1.2em; margin-bottom: 10px;…“ |
KKeine Bearbeitungszusammenfassung Markierung: Manuelle Zurücksetzung |
||
| (18 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
| Zeile 5: | Zeile 5: | ||
justify-content: space-between; | justify-content: space-between; | ||
gap: 20px; | gap: 20px; | ||
flex-wrap: wrap; | |||
} | } | ||
| Zeile 14: | Zeile 15: | ||
text-align: center; | text-align: center; | ||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); | box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); | ||
transition: transform 0.3s ease; | |||
} | |||
.tile:hover { | |||
transform: translateY(-5px); | |||
} | |||
.tile a { | |||
text-decoration: none; | |||
color: inherit; | |||
display: block; | |||
} | } | ||
| Zeile 31: | Zeile 43: | ||
font-size: 0.9em; | font-size: 0.9em; | ||
color: #666; | color: #666; | ||
} | |||
/* Media Query für mobile Geräte */ | |||
@media (max-width: 768px) { | |||
.tile { | |||
width: 100%; /* Kacheln werden untereinander angezeigt */ | |||
margin-bottom: 20px; /* Abstand zwischen den Kacheln */ | |||
} | |||
} | } | ||
</style> | </style> | ||
| Zeile 36: | Zeile 56: | ||
<div class="tiles-container"> | <div class="tiles-container"> | ||
<div class="tile"> | <div class="tile"> | ||
<img src="https:// | <a href="https://portal.hey-muenster.de/wiki/Ankommen-Arbeit"> | ||
<img src="/w/images/7/71/Work.jpg" alt="Bild 1"> | |||
<h3>Arbeit und Qualifizierung</h3> | |||
<p>Informationen rund um den Beruf.</p> | |||
</a> | |||
</div> | |||
<div class="tile"> | |||
<a href="https://portal.hey-muenster.de/wiki/Ankommen-Aufenthalt" target="_self"> | |||
<img src="/w/images/b/be/Muenster_Amtsgericht_04.jpg" alt="Bild 2"> | |||
<h3>Aufenthalt und Recht</h3> | |||
<p>Alles rund um das Thema Aufenthaltsrecht.</p> | |||
</a> | |||
</div> | </div> | ||
<div class="tile"> | <div class="tile"> | ||
< | <a href="https://portal.hey-muenster.de/wiki/Ankommen-Bildung" target="_self"> | ||
<img src="/w/images/9/9c/Pexels-pixabay-159844.jpg" alt="Bild 3"> | |||
<h3>Bildung und Anerkennung</h3> | |||
<p>Deine Bildung ist wichtig. Auch deine Zeugnisse und Abschlüsse. Was du tun kannst, erfährst du hier.</p> | |||
</a> | |||
</div> | </div> | ||
<div class="tile"> | <div class="tile"> | ||
< | <a href="https://portal.hey-muenster.de/wiki/Ankommen-Gesundheit" target="_self"> | ||
<img src="/w/images/d/d6/Sport.jpg" alt="Bild 4"> | |||
<h3>Gesundheit und Vorsorge</h3> | |||
<p>Gesundheit, Vorsorge und Fitness für dein Wohlbefinden.</p> | |||
</a> | |||
</div> | </div> | ||
<div class="tile"> | |||
<a href="https://portal.hey-muenster.de/wiki/Ankommen-Wohnen" target="_self"> | |||
<img src="/w/images/0/0d/Wohnen.jpg" alt="Bild 5"> | |||
<h3>Wohnen und Leben</h3> | |||
<p>In Münster wohnt es sich toll, aber es ist nicht einfach etwas passendes zu finden. Schau mal rein.</p> | |||
</a> | |||
</div> | |||
<div class="tile"> | |||
<a href="https://portal.hey-muenster.de/wiki/Freizeit" target="_self"> | |||
<img src="/w/images/5/5b/Schwan.jpg" alt="Bild 6"> | |||
<h3>Freizeit</h3> | |||
<p>Aasee, Altstadt, Abendessen - mehr hier.</p> | |||
</a> | |||
</div> | |||
</div> | </div> | ||
</includeonly> | </includeonly> | ||
