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

Bild will nicht verlinkt werden

Basilisk

Neues Mitglied
Grüße,

oben links befindet sich ja dieser Home-Banner, um auf die Startseite zu gelangen. Seltsamerweise funktioniert er nur wenn ich
HTML:
<a id="egal">
über
HTML:
<a href="Startseite.html">
   <img src="../Bilder/Banner.jpg" alt:"Home" title="Home" />
</a>
hin schreibe.

Ich hoffe ihr könnt was mit dem Code anfangen. Ich versteh den Fehler einfach nicht und was id damit zu tun hat.

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--Beginn des head-Bereichs-->
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>Unsere Leistungen</title>
    <link rel="stylesheet" type="text/css" href="../CSS/Formatierung.css"/>
    <link rel="stylesheet" type="text/css"
    href="../CSS/Linkformatierung.css"/>
    <link rel="stylesheet" type="text/css" href="../CSS/Navigation.css"/>
    <link rel="shortcut icon" href="../Bilder/Favicon.ico"
    type="image/x-icon"/>
    <link rel="icon" href="../Bilder/Favicon.ico" type="image/x-icon/>
  </head>
<!--Ende des head-Bereichs-->
<!--Beginn des body-Bereichs-->
  <body>
    <a href="Startseite.html">
      <img src="../Bilder/Banner.jpg" alt:"Home" title="Home" />
    </a>
    <div id="navigation">
      <ul>
        <li><a href="Startseite.html">Startseite</a></li>
    <li><a href="Unsere Leistungen.html">Unsere Leistungen</a></li>
    <li><a href="http://www.youtube.com/user/DeeJayGamePlay/" 
    target="blank">YouTube-Kanal</a></li>
    <li><a href="Impressum.html">Impressum</a></li>
      </ul>
    </div>
    <div id="box1">
    <h1>Unsere Leistungen</h1>
      <p>
    Text Text Text Text ...
      </p>
    <h2>Playlist</h2>
      <p>
    Text Text Text Text ...
      </p>
    <h3>Playlistpakete</h3>
      <p>
    Text Text Text Text ...
      </p>
<!--Beginn der Tabelle "Playlistpakete"-->
    <dl>
      <dt><strong>Wunschliste</strong></dt>
    <dd> Erstellung einer individuellen Playlist, ganz nach Wunsch des
    Anfragers</dd>
      <dt><strong>Top 100</strong></dt>
    <dd> Erstellung einer Playlist mit Songs aktueller Chartstürmer</dd>
      <dt><strong>House</strong></dt>
    <dd> Erstellung einer Playlist mit Songs aus dem elektronischen 
    Genrebereichen wie House, Dance und Electro</dd>
      <dt><strong>Pop</strong></dt>
    <dd> Erstellung einer Playlist mit Songs aus dem Genrebereich Pop
    </dd>
      <dt><strong>HipHop</strong></dt>
    <dd> Erstellung einer Playlist mit Songs aus dem afroamerikanischen
    Genrebereich wie Hip Hop, R&amp;B und Rap</dd>
      <dt><strong>Rock</strong></dt>
    <dd> Erstellung einer Playlist mit Songs aus dem Genrebereich Rock
    wie Metal, Punk und Rock selbst</dd>
    </dl>
    </div>
<!--Ende der Tabelle "Playlistpakete"-->
    
  </body>
<!--Ende des body-Bereichs-->
</html>

Vielen Dank für jede Hilfe.

LG, Basi
 
Ich habe drei verschiedene css-Dokumente erstellt. Ist das sinnvoll?

Linkformatierung

HTML:
a:link {
text-decoration: none;
color: #694005;
font-weight: bold;
}
a:visited {
text-decoration: none;
color: #694005;
}
a:focus, a:hover {
text-decoration: underline;
color: #FFD874;
}
a:active {
text-decoration: underline;
color: #FFE5A4;
}
a img {
  border: none;
}

Navigation
HTML:
#navigation a {
  font-weight: bold;
  text-decoration: none;
}
#navigation a:hover, #navigation a:active, #navigation a:focus {
  Color: #2E2611;
}
#navigation li {
  list-style-type: none;
  display: inline;
  padding-right: 40px;
}
#navigation ul {
  margin: 0;
  padding: 0;
}
Formatierung
HTML:
body {
  font-family: arial, sans-serif;
  font-size: 14px;
  line-height: 1.1;
  color: #2E2611;
  background: url(../Bilder/Hintergrund.jpg) repeat-x;
}
h1 {
  font-family: "Times New Roman", Times, sans-serif;
  font-size: 2.5em;
  font-style: italic;
  text-indent: 0.5em;
  color: #060502;
}
h2 {
  font-family: "Times New Roman", Times, sans-serif;
  font-size: 1.5em;
  font-style: italic;
  text-indent: 1em;
  color: #060502;
}
h3 {
  font-family: "Times New Roman", Times, sans-serif;
  font-size: 1.2em;
  text-indent: 1em;
  color: #060502;
}
dt {
  font: 1.1em/1.4 "Times New Roman", Times, sans-serif;
  text-indent: 1em;
  color: #060502;
}
#box1 {
  background-color: #d3c8bd;
  width: 50%;
  padding: 10px;
  border: 3px solid #7A4E0B;
  margin: 10px;
}
#box2 {
  background-color: #d3c8bd;
  width: 50%;
  padding: 10px;
  border: 3px solid #7A4E0B;
  margin: 10px;
}
 
Der Link funktioniert nicht, nicht die Formatierung. ;)

Wie du am Syntaxhighlighting des Codeblocks schon erkennst, hat sich ein ganz simpler Fehler eingeschlichen
HTML:
<link rel="icon" href="../Bilder/Favicon.ico" type="image/x-icon/>
Da fehlt ein Gänsefüßchen. ;)


//edit: Nein, das bremst das Laden der Seite aus. In der finalen Version deiner Website würde ich sie auf jeden Fall zusammenschmeißen.
 
Zuletzt bearbeitet:
hab das übersehen :D ,dachte das da vlt was bei id egal nicht sitmmt, da mir sonst kein fehler aufgefallen ist .... würde auch alles in eine datei machn , ist auch übersichtlicher finde ich
 
Krass! Da fehlt ein simples Gänsefüsschen und der ganze nachfolgende Text ist davon betroffen.
(bitte nicht so schwierige Wörter benutzen wie Syntaxhighlighting des Codeblocks. Ich bin noch am lernen ;))

Aber was hat die Favicon-Zeile mit dem Link zu tun?

Und was du zum Schluss geschrieben hast. Du meinst ich sollte alle css-Dokumente in die einzelnen HTML-Dokumente packen? Warum. Das verbraucht doch viel mehr Platz? Man braucht doch für jede Seite ein eigenes html-Dokument und dann müsste ichs ja überall reinschreiben. Ich mein. Da sind diese simplen Zeilen

HTML:
<link rel="stylesheet" type="text/css" href="../CSS/Formatierung.css"/>
<link rel="stylesheet" type="text/css"href="../CSS/Linkformatierung.css"/>
<link rel="stylesheet" type="text/css" href="../CSS/Navigation.css"/>
deutlich leichter.
Oder meinst du die css-Dokumente alle in eines packen damit nur eine von den drei gerade genannten Zeilen gebraucht wird. Dann ergibs für mich sinn ^^

LG und vielen Dank ^^
 
den inhalt aller css dateien in eine css und dann halt
PHP:
<link rel="stylesheet" type="text/css" href="../CSS/style.css" />
 
Aso, cool, mach ich, danke ^^

Ist denn sonst noch was, was verbesserungswürdig ist? Lieber jetzt bescheid sagen bevor ichs ganz zum Schluss merke.

Z.B. bei der Navigationsleiste. DIe muss ich auf jeder Seite über HTML neu einrichten:

<ul>
<li><a href=&quot;Startseite.html&quot;>Startseite</a></li>
<li><a href=&quot;Unsere Leistungen.html&quot;>Unsere Leistungen</a></li>
<li><a href=&quot;http://www.youtube.com/user/DeeJayGamePlay/&quot;
target=&quot;blank&quot;>YouTube-Kanal</a></li>
<li><a href=&quot;Impressum.html&quot;>Impressum</a></li>
</ul>
Geht das einfacher oder ist das normal?
 
du kannst es auch includen bsp
PHP:
<?php include("navi.html"); ?>
dann muss deine Seite aber .php sein und das was included ( eingefügt ) werden soll halt in navi.html speichern zb deine Navi html
PHP:
<ul>
<li><a href=&quot;Startseite.html&quot;>Startseite</a></li>
<li><a href=&quot;Unsere Leistungen.html&quot;>Unsere Leistungen</a></li>
<li><a href=&quot;http://www.youtube.com/user/DeeJayGamePlay/&quot; 
target=&quot;blank&quot;>YouTube-Kanal</a></li>
<li><a href=&quot;Impressum.html&quot;>Impressum</a></li>
</ul>
 
Uh, PHP. Damit kenn ich mich ja noch gar net aus. Da muss ich noch was warten bis ich das Kapitel erreicht hab ^^

Danke für die Hilfe nochmals

LG
 
Noch ne Frage zum Abschluss. Mein Buch hat mir vor ein paar Tagen gesagt, ich müsse um eine ordentliche horizontale Navigationsleiste zu erstellen, folgenden Code eingeben:

HTML:
#navigation a {
  font-weight: bold;
  text-decoration: none;
}
#navigation a:hover, #navigation a:active, #navigation a:focus {
  Color: #2E2611;
}
#navigation li {
  list-style-type: none;
  display: inline;
  padding-right: 40px;
}
#navigation ul {
  margin: 0;
  padding: 0;
}

Ich fänds super, wenn mir jemand erklären kann, was genau ich da alles gemacht habe und ob einiges unnötig davon ist oder alles zusammen rein kann, keine Ahnung.
Außer die einzelnen Elemente (so heißen die doch, margin, padding, font-weight etc., wenn ich mich nich Irre) versteh ich das ganze nich.

LG, Basi
 
Eine genaue Erklärung sollte in deinem Buch stehen. Eine horizontale Navigation kann man auf viele Wege aufbauen. Der Schnippsel den Du hier gepostet hast ergibt für mich nicht wirklich eine solche, vor allem auch weil der HTML-Code fehlt.
 
Eine Erklärung steh auch im Buch, nur komm ich damit nich ganz klar.

Also, der CSS-Code, den ich da oben habe zusammen mit:

HTML:
<div id="navigation">
      <ul>
        <li><a href="Startseite.html">Startseite</a></li>
    <li><a href="Unsere Leistungen.html">Unsere Leistungen</a>
    <li><a href="http://www.youtube.com/user/DeeJayGamePlay/" 
    target="blank">YouTube-Kanal</a></li>
    <li><a href="Impressum.html">Impressum</a></li></li>
      </ul>
</div>

ergibt eine schöne Navigationsleiste.
Nur möchte ich wissen, wie wo was bei dem CSS-Code hinkommt. Da sind schließlich vier verschiedene id-Dinger. Ich hoffe ihr wisst was ich meine.

LG
 
"id-Dinger" gibt es nur 1. Nämlich #navigation. Und für einzelne Elemente die innerhalb dieser ID liegen werden nun bestimmte Eigenschaften festgelegt. Teste es mal an etwas einfachem aus:

HTML:
<p id="deintest">Das ist ein Text mit einem <a href="#">Link</a>.</p>

Code:
#deintest {
 color: red;
}

#deintest a {
 color: blue;
}

Hoffe ich habe richtig verstanden was Du meinst ;)
 
Danke, ich schätze ich begreifs jetz ein wenig. Ich brauch halt noch was Zeit damit ich diese Matterie verstehe ^^

Danke dir ^^

edit: Und gute Idee mit dem:

HTML:
<a href="#">zum Seitenanfang</a>

damit kommt man direkt nach ganz oben. Optimal ^^
 
Optimal für einen Link nach oben wäre

HTML:
<a name="top"></a>

direkt hinter <body> zu schreiben und darauf mittels

HTML:
<a href="#top">zum Seitenanfang</a>

zu verlinken :]

Denn "#" als Ziel gibt es eigentlich gar nicht wirklich.
 
Oh, gut, danke. Und warum klappt das trotdem?


Und wo ich grad wieder on bin:

ne zweite FRage,

- müsste

HTML:
h1 {
  font-family: "Times New Roman", Times, sans-serif;
  font-size: 2.2em;
  font-style: italic;
  text-indent: 0.5em;
  color: #060502;
}

auf h1-Überschriften logischerweise eine höhere Spezifität haben als

HTML:
body {
  font-family: arial, sans-serif;
  font-size: 13px;
  line-height: 1.1;
  color: #2E2611;
  background: url(../Bilder/Hintergrund.jpg) repeat-x;
}

? Oder Irre ich mich da?
 
Die Eigenschaften von h1 überschreiben jene von body. Das ist korrekt, denn Kindelemente überschreiben die ihrer Eltern. ;)

Das klappt mit dem # klappt trotzdem, weil Browser vieles tun, was eigentlich so nicht ganz korrekt ist. Du kannst auch in XHTML-Dokumenten an einen Link target="_blank" hängen und der Browser öffnet den Link dann im neuen Fenster/Tab, obwohl es das Attribut in XHTML eigentlich gar nicht gibt, nur in HTML...
 
Hallo.

Für was willst du denn jetzt wieder eine id verwenden?
In den letzten Postings hat niemand etwas von einer id geschrieben.

Gruss
Elroy
 
Zurück
Oben