Text auf Bild in HTML einfügen?

3 Antworten

medmonk
Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer
Computer, IT
09.10.2021, 22:55

HTML:

<header class="header d-flex text-center">
  <h1 class="header__title">Hamburg - meine Stadt.</h1>
</header>

CSS:

/* helper classes */
.text-center { 
 text-align: center; 
}

.d-flex {
 display: flex;
 justify-content: center;
 align-items: center;
}

/* primary styles */
.header {
  width: 100%;
  min-height: 8rem;
  background: url('path/image.jpg') no-repeat center;
  background-size: cover;
}

.header__title {
  font-size: clamp(1.65rem, 3.5vw, 2.45rem);
  color: #000;
}

LG medmonk

Woher ich das weiß:Berufserfahrung – UI/UX Designer, Full-Stack Developer
herterr
07.10.2021, 19:53

<div class="container">

 <img src="img_snow_wide.jpg" alt="Snow" style="width:100%;">

 <div class="bottom-left">Bottom Left</div>

 <div class="top-left">Top Left</div>

 <div class="top-right">Top Right</div>

 <div class="bottom-right">Bottom Right</div>

 <div class="centered">Centered</div>

</div>
Evlin315 
Fragesteller
 07.10.2021, 20:00

Gebe ich das in HTML oder CSS ein

0
fred67
07.10.2021, 20:03

Soll das in eine Homepage? Kannst du HTML programmieren? Rein theoretisch kann man das auch mit LibreOffice WYSIWYG erstellen und dann als HTML abspeichern. Ist aber nicht so elegant wie mein Vorredner und auch nicht für jeden Zweck zu gebrauchen.
Evlin315 
Fragesteller
 07.10.2021, 20:06

Ich lerne für eine Arbeit in der Schule und kann nicht programmieren. Ich benutze Codepen

0