Hauptbild mit H1 und Button darüber (responsive)?
Bitte helft mir mit einem einfachen HTML und CSS Code.
Ich will einfach ein großes Hauptbild das responsive (width: 100%) dargestellt wird, und dadrüber zentriert eine Überschrift und ein Button. Versuche es leider schon lange aber bekomme immer wieder Fehler.
1 Antwort
Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer
HTML, Webseite, programmieren
Ich gehe davon aus, dass darüber eine Positionierung auf z-Ebene bedeutet.
HTML:
<section class="stage">
<h1>Title</h1>
<button type="button">Button</button>
</section>
Statt einem section-Element könnte header passender sein, wenn es sich um die oberste Sektion auf der Webseite handelt.
CSS:
.stage {
align-items: center;
background-image: url('path/to/image/...');
display: flex;
flex-direction: column;
justify-content: center;
}
Die Bildskalierung kannst du mit dem background-size-Property regulieren.