• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bild/Grafik in Fußzeile einfügen - Adobe Portfolio Website

thomas.stl

Neues Mitglied
Hallo zusammen,

ich bin leider absoluter Neuling in Sachen Html und Co. und möchte gerne wissen, wie ich ein Bild (links neben dem Text auf gleicher Höhe) in die Fußzeile bei Adobe Portfolio einfügen kann.

Aktuell habe ich den Text stehen - jetzt fehlt mir nur noch das Bild: © 2025 - TS | <a href="Link1" target="_self">Impressum</a> | <a href="Link2" target="_self">Datenschutz</a>
Kann mir da einer behilflich sein?
Adobe Portfolio unterstützt laut Website folgende Tags: "a", "article", "b", "blockquote", "br", "caption", "code", "del", "details", "div", "em",<br>"h1", "h2", "h3", "h4", "h5", "h6", "hr", "i", "img", "ins", "kbd", "li", "main", "ol",<br>"p", "pre", "section", "span", "strike", "strong", "sub", "summary", "sup", "table",<br>"tbody", "td", "th", "thead", "tr", "ul"
Vielen Dank im Voraus,

Thomas
 

Anhänge

  • Screenshot 2025-04-17 223721.png
    Screenshot 2025-04-17 223721.png
    120 KB · Aufrufe: 4
Mit deinen "dünnen" Angaben ist eine direkte Hilfe leider nicht möglich, deshalb kann ich dir nur allgemein antworten. Es gibt für Anfänger kein einfacheres HTML und CSS.

Grundsätzlich würde ich dir folgende Vorgehensweise empfehlen:

1. Das Bild mittels eines Bildbearbeitungsprogramms auf die Größe verkleinern, wie es maximal gezeigt werden soll.

2. Das Bild durch das img-Element vor dem Text einfügen. Das zusätzliche figure-Element wäre wahrscheinlich sinnvoll, ist aber laut deinen Angaben Adobe Portfolio nicht bekannt.

3. Mit CSS das Bild mit dem Text auf eine Höhe bringen, wobei wahrscheinlich CSS-Grid am geeignetsten ist.

Ich habe mal eine einfache Beispielseite erstellt:

Code:
<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8">
   <title>Bild einfügen</title>
   <meta name="description" content="Platzhalter - Ein kurze Beschreibung des Inhalts in Satzform">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <style>
      div {
         display: grid;
         grid-template-columns: 1fr 1fr;
         align-items: center;
      }
      div :nth-child(1) {
         margin-left: auto;
      }
   </style>
</head>
<body>
   <div>
      <img src="https://www.w3.org/html/logo/downloads/HTML5_Logo_256.png" alt="Ein Beispiellogo">
      <p>© 2025 - TS | <a href="Link1" target="_self">Impressum</a> | <a href="Link2" target="_self">Datenschutz</a> </p>
   </div>
</body>
</html>
 
Zuletzt bearbeitet:
Zurück
Oben