HTML Webseite erstellen

GTA 3

Lt. Junior Grade
Registriert
Nov. 2010
Beiträge
374
Hi ich hab hier diesen Quellcode! Hinzugefügt ! Ist ganz unten!

Leider war es wieder ein bischen her das ich mich mit HTML verfasst habe!

Mein Code sieht gerade so aus!
Wie ihr sieht noch ganz am Anfang! Wie krieg ich es nochmal hin das wenn ich bei den unteren 6 Blöcken den Mauszeiger darüber bewegt und dann sich die Hintergrundfarbe der einzelnen Blöcke sich dann Gelb färbt und eventuell dann die Schrift von weiß auf Schwarz !?


Zitat:<html>
<head>
<title>Projeckt Webseite</title>
</head>
<body style="background-color:#333333" text="#FFFFFF">
<br>




<br>
<table width="100%" border="1" cellpadding="10" cellspacing="0" bgcolor="#000000">
<tr>
<th><font color="#CCFF00" size=+3 align="middle" ><br>BEGRÜßUNG und INFOS<p></p></font></th>
</tr>
</table>

<table width="100%" border="2" bgcolor="#000000" cellpadding="10" cellspacing="0">
<tr>
<th bgcolor="#000000" onMouseOver="this.bgColor='#CCFF00'" onMouseOut="this.bgColor='#000000'">
<font color="#FFFFFF" onMouseOver="this.color='#000000'" onMouseOut="this.color='#FFFFFF'">ICH BIN EIN TEXT
</font>
</th>
<th bgcolor="#000000" onMouseOver="this.bgColor='#CCFF00'" onMouseOut="this.bgColor='#000000'">
<font color="#FFFFFF" onMouseOver="this.color='#000000'" onMouseOut="this.color='#FFFFFF'">ICH BIN EIN TEXT
</font>
</th>
<th>ICH BIN EIN TEXT</th>
<th>ICH BIN EIN TEXT</th>
<th>ICH BIN EIN TEXT</th>
</tr>
</table>








</body>
</html>
Danke und MFG

Ich habs jetzt hingekriegt aber, damit die Schrift dann seine Farbe auch ändert wenn sich er Hintergrund ändert muss ich mit der Maus auch erst die Schrift berühren damit die Schrift erkennbar ist! -_-

Und geordnet ist es nicht, weil es hier im Forum nicht geordnet wird.
 
Na klasse, mit CSS, hab ich noch nicht so allzu große Erfarungen!

Habs jetzt trozdem mal probiert, aber es klappt trotzdem nicht.

<table width="100%" border="2" bgcolor="#000000" cellpadding="10" cellspacing="0">
<tr>
<th id="test" #test{color:#FFFFFF;background:#000000;}
#test:hover{color:#000000;background:#CCFF00;}>ICH BIN EIN TEXT
</th>
<th bgcolor="#000000" onMouseOver="this.bgColor='#CCFF00'" onMouseOut="this.bgColor='#000000'">
<font color="#FFFFFF" onMouseOver="this.color='#000000'" onMouseOut="this.color='#FFFFFF'">ICH BIN EIN TEXT
</font>
</th>
<th>ICH BIN EIN TEXT</th>
<th>ICH BIN EIN TEXT</th>
<th>ICH BIN EIN TEXT</th>
</tr>
</table>
 
Nein, im Ernst, lies dich in CSS ein. Das ist der Standard mittlerweile, und wenn du einmal drin bist fällt dir das Ganze auch leichter.
 
deine beispiele haben nichts mit html oder css zu tun.

<html>
<head>
</head>
<style>
#test{color: #0AC;}
#test:hover {color: #000;}
</style>
<body>
<p id="test">Hallo></p>
</body>
</html>


Versuchs mal damit.
# wählt Elemente mit der Id
. mit der Klasse (.class)
div wählt z.B: alle div- Tags

(das sind CSS Selektoren)
 
Da kommt einiges auf mich zu. :eek: Ich schau mir das bei SelfHTML mal an, kann mir jemand in der Zwischenzeit trozdem erklären wo mein Fehler ist ?

EDIT:
 
Zuletzt bearbeitet:
Es liegt einfach daran, dass du im th-Tag keine Referenz zum font-Tag hast.
Da müssen die IDs ins Spiel kommen

Code:
<th bgcolor="#000000" onMouseOver="this.bgColor='#CCFF00'; document.getElementById('asd').color='#000000'" onMouseOut="this.bgColor='#000000'; document.getElementById('asd').color='#FFFFFF'">
<font id="asd">ICH BIN EIN TEXT</font>

Aber wie du schon siehst, wird das sehr unübersichtlich.
Deswegen solltest du dich auch mit CSS auseinandersetzen. So kannst du die Gestaltung der Webseite vom Inhalt trennen und du schaffst dir eine Übersicht.

btw. Es schreibt sich "Projekt" ;)
 
Zuletzt bearbeitet:
Ach die CSS ist ne extra Datei... :ugly:

EDIT: SO Jungs bin scho ziemlich weit!
Meine Frage:
CSS von vorhin: Was genau hat es mit dem
@charset "utf-8";
/* CSS Document */

auf sich? Das kapier ich grad nicht.

Und irgendwie will die verankerung im QT nicht klappen: Wie soll ich verankern ? Ich kann ja nur mit <a name="XXX"> verankern oder ?
So sieht mein HTML-QT aus:

<html>
<head>
<title>Projeckt Webseite</title>
<link rel="stylesheet" href="css.css" type="text/css" />
</head>

<body style="background-color:#333333" text="#FFFFFF">
<br>
<br>

<table width="100%" border="1" cellpadding="10" cellspacing="0" bgcolor="#000000">
<tr>
<th><font color="#CCFF00" size=+3 align="middle" ><br>Herzlich Willkommen<p></p></font></th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th id="test1">Einleitung</th>
<th id="test">Fotos</th>
<th id="test">Kontakt</th>
<th id="test">Impressum</th>
<th id="test">AGBs</th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th>EINLEITUNG<p></p><br></th>
</tr>
</table>

<table width="100%" border="1" cellpadding="10" cellspacing="0" bgcolor="#000000">
<tr>
<th><font color="#CCFF00" size=+2 align="middle" ><p>Fotos</font></p></th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th id="test">Einleitung</th>
<th id="test1">Fotos</th>
<th id="test">Kontakt</th>
<th id="test">Impressum</th>
<th id="test">AGBs</th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th>Fotos <p></p><br></th>
</tr>
</table>

<table width="100%" border="1" cellpadding="10" cellspacing="0" bgcolor="#000000">
<tr>
<th><font color="#CCFF00" size=+2 align="middle" ><p>Kontakt</font></p></th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th id="test">Einleitung</th>
<th id="test">Fotos</th>
<th id="test1">Kontakt</th>
<th id="test">Impressum</th>
<th id="test">AGBs</th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th>Kontakt<p></p><br></th>
</tr>
</table>

<table width="100%" border="1" cellpadding="10" cellspacing="0" bgcolor="#000000">
<tr>
<th><font color="#CCFF00" size=+2 align="middle" ><p>Impressum</font></p></th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th id="test">Einleitung</th>
<th id="test">Fotos</th>
<th id="test">Kontakt</th>
<th id="test1">Impressium</th>
<th id="test">AGBs</th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th>Impressum <p></p><br></th>
</tr>
</table>

<table width="100%" border="1" cellpadding="10" cellspacing="0" bgcolor="#000000">
<tr>
<th><font color="#CCFF00" size=+2 align="middle" ><p>AGBs</font></p></th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th id="test">Einleitung</th>
<th id="test">Fotos</th>
<th id="test">Kontakt</th>
<th id="test">Impressium</th>
<th id="test1">AGBs</th>
</tr>
</table>

<table width="100%" border="2" cellpadding="10" cellspacing="0">
<tr>
<th>AGBs <p></p><br></th>
</tr>
</table>

</body>
</html>

und so meine CSS:

@charset "utf-8";
/* CSS Document */

#test{
color:#FFFFFF;
background:#000000;
}

#test:hover{
color:#000000;
background:#CCFF00;
}

#test1{
color:#000000;
background:#CCFF00;
}
 
IDs dürfen nur einmal im HTML Quelltext vorkommen. Da diese eindeutig sind.
Wenn du diese mehrmals anwenden willst, musst du sie als Klassen (class) definieren.

Was meinst du mit "Verankerung"?

@charset "utf-8"; bedeutet einfach nur, dass er den Text als UTF-8 kodiert.

Und mach dich richtig mit CSS vertraut.
Das, was du da machst, ist totaler Murks.
Code:
<table width="100%" border="1" cellpadding="10" cellspacing="0" bgcolor="#000000">
Sowas brauchst du nicht im HTML schreiben, wenn du die Tabellen mit CSS gestaltest.
 
Whiz-zarD schrieb:
IDs dürfen nur einmal im HTML Quelltext vorkommen. Da diese eindeutig sind.
Wenn du diese mehrmals anwenden willst, musst du sie als Klassen (class) definieren.

Was meinst du mit "Verankerung"?

@charset "utf-8"; bedeutet einfach nur, dass er den Text als UTF-8 kodiert.

Und mach dich richtig mit CSS vertraut.
Das, was du da machst, ist totaler Murks.
Code:
<table width="100%" border="1" cellpadding="10" cellspacing="0" bgcolor="#000000">
Sowas brauchst du nicht im HTML schreiben, wenn du die Tabellen mit CSS gestaltest.

Alles klar, das mit dem extra definieren. Ehm ich mein das Ankern in HTML! Also wenn ich jetzt bei der ganz oberen Tabelle auf AGBs klicke soll das Bild auf den AGB Abschnitt runterspringen!

Das mit der Tabelle, kann ich nicht so richtig, deswegen bleib ich da lieber fürs erste bie den HTML Codes!
 
Zurück
Oben