CSS, Java Script u.s.w
Moderator: HTML-Laie
moni
Held des Forums
Beiträge: 8367 Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken
Beitrag
von moni » Do 27. Sep 2012, 06:47
ulli hat geschrieben: ich werde mir das morgen mal in Ruhe durchlesen....wenn ich ehrlich bin...ich habe nix verstanden....oh wie peinlich ist das denn????
Mag sein das ich auch sehr kompliziert alles erkläre .
.. auf jeden Fall es muss nicht Dir peinlich sein !!!
ich vermute das du einfach zu lange pause gehabt hast, und einfach aus der Übung bist ! ...aber wenn die Ulli da nicht nicht hinkriegt da musste Sie anders heißen
Viele Grüße ...Monika
moni
Held des Forums
Beiträge: 8367 Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken
Beitrag
von moni » Do 27. Sep 2012, 21:26
So Ulli hier ist die Galerie für 20 Bilder ..muss nur die Bilder URL zugeben
a.bild1 { display:block; background-image:url(
Hier die S/W ); width:350px; height:300px;}
a.bild1:hover { background-image:url(
Hier die Bunten ); width:350px; height:300px; }
unten in die Tabelle bleibt alles so wie es ist !
Hatte auch einen Titel für die Galerie gemacht ..bei <h1>Lüneburger Heide </h1>...wenn du das nicht haben willst kannst ruhig wegmachen
Code: Alles auswählen
<head>
<title>Lünenbürger Heide </title>
<style type="text/css">
a.bild1 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild1:hover { background-image:url(url ); width:350px; height:300px; }
a.bild2 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild2:hover { background-image:url(url ); width:350px; height:300px; }
a.bild3 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild3:hover { background-image:url(url ); width:350px; height:300px; }
a.bild4 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild4:hover { background-image:url(url ); width:350px; height:300px; }
a.bild5 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild5:hover { background-image:url(url ); width:350px; height:300px; }
a.bild6 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild6:hover { background-image:url(url ); width:350px; height:300px; }
a.bild7 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild7:hover { background-image:url(url ); width:350px; height:300px; }
a.bild8 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild8:hover { background-image:url(url ); width:350px; height:300px; }
a.bild9 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild9:hover { background-image:url(url ); width:350px; height:300px; }
a.bild10 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild10:hover { background-image:url(url ); width:350px; height:300px; }
a.bild11 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild11:hover { background-image:url(url ); width:350px; height:300px; }
a.bild12 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild12:hover { background-image:url(url ); width:350px; height:300px; }
a.bild13 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild13:hover { background-image:url(url ); width:350px; height:300px; }
a.bild14 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild14:hover { background-image:url(url ); width:350px; height:300px; }
a.bild15 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild15:hover { background-image:url(url ); width:350px; height:300px; }
a.bild16 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild16:hover { background-image:url(url ); width:350px; height:300px; }
a.bild17 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild17:hover { background-image:url(url ); width:350px; height:300px; }
a.bild18 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild18:hover { background-image:url(url ); width:350px; height:300px; }
a.bild19 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild19:hover { background-image:url(url ); width:350px; height:300px; }
a.bild20 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild20:hover { background-image:url(url ); width:350px; height:300px; }
</style>
</head>
<body>
<h1><center>Lüneburger Heide </center></h1>
<table align="center" border="0"cellpadding="3" cellspacing="3">
<tr>
<td><a class="bild1" href="#"></a> </td>
<td><a class="bild2" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
<td><a class="bild3" href="#"></a> </td>
<td><a class="bild4" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
<td><a class="bild5" href="#"></a> </td>
<td><a class="bild6" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
<td><a class="bild7" href="#"></a> </td>
<td><a class="bild8" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
<td><a class="bild9" href="#"></a> </td>
<td><a class="bild10" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
<td><a class="bild11" href="#"></a> </td>
<td><a class="bild12" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
<td><a class="bild13" href="#"></a> </td>
<td><a class="bild14" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
<td><a class="bild15" href="#"></a> </td>
<td><a class="bild16" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
<td><a class="bild17" href="#"></a> </td>
<td><a class="bild18" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
<td><a class="bild19" href="#"></a> </td>
<td><a class="bild20" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Lüneburger Heide
</center></h2></td>
<td><h2><center>Lüneburger Heide
</center></h2></td>
</tr>
<tr>
</table>
</body>
Viele Grüße ...Monika
ulli
Webmaster Alt Meister
Beiträge: 1451 Registriert: Do 14. Okt 2010, 16:10
Mein Vorname: Ulli
Wohnort: zu Hause
Kontaktdaten:
Beitrag
von ulli » Do 27. Sep 2012, 21:31
danke dir...und da muss ich nur noch die Bilder einfügen?? Cool...danke dir...ja mit der Überschrift ist okay...
moni
Held des Forums
Beiträge: 8367 Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken
Beitrag
von moni » Do 27. Sep 2012, 21:35
ja nur die URL Bilder ..so wie in den B mit roten Schrift
Viele Grüße ...Monika
ulli
Webmaster Alt Meister
Beiträge: 1451 Registriert: Do 14. Okt 2010, 16:10
Mein Vorname: Ulli
Wohnort: zu Hause
Kontaktdaten:
Beitrag
von ulli » Do 27. Sep 2012, 21:54
hab ich alles fein gemacht...nur werden keine Bilder angezeigt...was habe ich falsch gemacht???
Jasko
Globaler Moderator
Beiträge: 3294 Registriert: Di 21. Feb 2012, 06:59
Mein Vorname: Jasmin
Wohnort: Wien
Kontaktdaten:
Beitrag
von Jasko » Do 27. Sep 2012, 23:27
Hast es wohl geschafft, ich sehe die Bilder
moni
Held des Forums
Beiträge: 8367 Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken
Beitrag
von moni » Fr 28. Sep 2012, 06:39
ulli hat geschrieben: hab ich alles fein gemacht...nur werden keine Bilder angezeigt...was habe ich falsch gemacht???
habe vergessen ..man darf nicht mehr das head und body mit auf eine Text- Seite einbringen ( neuen Npage Regel )..aus diese Grund waren die Bilder nicht mehr zu sehen ..
das Problem ist schon gelöst
http://pokerlady.npage.de/lueneburger-heide.html ( man muss nur noch die restlichen Bilder verlinken )
und für die Zukunft und ewentuel für interessierte noch mal das Skript ..
Code: Alles auswählen
<title>Mouserover Galerie </title>
<style type="text/css">
a.bild1 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild1:hover { background-image:url(url ); width:350px; height:300px; }
a.bild2 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild2:hover { background-image:url(url ); width:350px; height:300px; }
a.bild3 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild3:hover { background-image:url(url ); width:350px; height:300px; }
a.bild4 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild4:hover { background-image:url(url ); width:350px; height:300px; }
a.bild5 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild5:hover { background-image:url(url ); width:350px; height:300px; }
a.bild6 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild6:hover { background-image:url(url ); width:350px; height:300px; }
a.bild7 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild7:hover { background-image:url(url ); width:350px; height:300px; }
a.bild8 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild8:hover { background-image:url(url ); width:350px; height:300px; }
a.bild9 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild9:hover { background-image:url(url ); width:350px; height:300px; }
a.bild10 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild10:hover { background-image:url(url ); width:350px; height:300px; }
a.bild11 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild11:hover { background-image:url(url ); width:350px; height:300px; }
a.bild12 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild12:hover { background-image:url(url ); width:350px; height:300px; }
a.bild13 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild13:hover { background-image:url(url ); width:350px; height:300px; }
a.bild14 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild14:hover { background-image:url(url ); width:350px; height:300px; }
a.bild15 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild15:hover { background-image:url(url ); width:350px; height:300px; }
a.bild16 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild16:hover { background-image:url(url ); width:350px; height:300px; }
a.bild17 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild17:hover { background-image:url(url ); width:350px; height:300px; }
a.bild18 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild18:hover { background-image:url(url ); width:350px; height:300px; }
a.bild19 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild19:hover { background-image:url(url ); width:350px; height:300px; }
a.bild20 { display:block; background-image:url(url); width:350px; height:300px;}
a.bild20:hover { background-image:url(url ); width:350px; height:300px; }
</style>
<h1><center>Mouserover Galerie für 20 Bilder </center></h1>
<table align="center" border="0"cellpadding="3" cellspacing="3">
<tr>
<td><a class="bild1" href="#"></a> </td>
<td><a class="bild2" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr>
<tr>
<td><a class="bild3" href="#"></a> </td>
<td><a class="bild4" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr><tr>
<td><a class="bild5" href="#"></a> </td>
<td><a class="bild6" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr><tr>
<td><a class="bild7" href="#"></a> </td>
<td><a class="bild8" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr><tr>
<td><a class="bild9" href="#"></a> </td>
<td><a class="bild10" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr><tr>
<td><a class="bild11" href="#"></a> </td>
<td><a class="bild12" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr><tr>
<td><a class="bild13" href="#"></a> </td>
<td><a class="bild14" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr><tr>
<td><a class="bild15" href="#"></a> </td>
<td><a class="bild16" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr><tr>
<td><a class="bild17" href="#"></a> </td>
<td><a class="bild18" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr><tr>
<td><a class="bild19" href="#"></a> </td>
<td><a class="bild20" href="#"></a> </td>
</tr>
<tr>
<td><h2><center>Titel
</center></h2></td>
<td><h2><center>Titel
</center></h2></td>
</tr>
</table>
Viele Grüße ...Monika
Mitglieder in diesem Forum: Bing [Bot] , Google [Bot] und 1 Gast