Tutorial – Bilder-Galerie nur mit CSS (I)

Hier findest du Tutorien mit Detaillierte Beschreibungen für den KompoZer

Re: Tutorial – Bilder-Galerie nur mit CSS (I)

Beitragvon gimp-michel » Sa 5. Apr 2008, 13:21

Klopferlinchen hat geschrieben:Hab nämlich noch das Problem, dass ich nicht genau weiß, welche Einstellung welchen Code erzeugt.
Das ist etwas verwirrend ;)

Vor dem gleichen Problem habe ich auch gestanden bei meinen ersten Gehversuchen mit dem KompoZer. :shock:
Aber da gibt es einen Weg wie dir der CaScadeS dabei hilft. Wenn du einen Teil einer Regel nicht kennst dann nimm eine leere Regel und trage nur diesen einen Teil in die Karteikarte Allgemein ein. Da CaScadeS in beiden Richtungen arbeitet, also Karteikarte Allgemein <==> die anderen Karteikarten, brauchst du nur noch die anderen Karteikarten zu kontrollieren wo dein Eintrag gelandet ist. Es gibt ja nur den einen Eintrag. Und nach kurzer Zeit sind dir die ganzen "Häckchenbuden" geläufig auch wenn sie im Quelltext zum Anfang verwirrend sind.
Gruß gimp-michel
Wenn Windows die Antwort ist, wie dämlich war dann die Frage?

Benutzeravatar
gimp-michel
Administrator
 
Beiträge: 3137
Registriert: Mo 7. Jan 2008, 00:24

Re: Tutorial – Bilder-Galerie nur mit CSS (I)

Beitragvon loopborg » Fr 13. Nov 2009, 21:30

Hallo,

ich habe jetzt das Tut 1:1 nachgebildet und es funktioniert in IE6 bis 8, Firefox, Opera, Chrome

Das Tut2 und 3 (mit anklickbaren thumbnails) hat in Chrome und IE8 leichte Probleme. Dazu mehr in diesem thread:
http://www.kompozer-web.de/forum/viewtopic.php?f=18&t=24&start=40

Viele Grüsse
Micha
Benutzeravatar
loopborg
 
Beiträge: 138
Registriert: Mi 19. Aug 2009, 20:17
Wohnort: Hamburg

Re: Tutorial – Bilder-Galerie nur mit CSS (I)

Beitragvon h.r. » Do 11. Feb 2010, 10:44

Erstmal Hallo und danke für die tollen Tuts. Ich bin nicht das erste mal hier und schon etliches aus dem Board herrausgesucht und gelernt aber jetzt muss ich mal eine Frage stellen.
Ich habe die Bildergalerie eingebaut und lokal funktioniert alles wunderbar nur im Netz nicht. Mit dem FF 3.6 getestet.

Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
  <title>Zimmerei Hans Rausch Projekte</title>
  <link rel="stylesheet" href="Img/main.css"
type="text/css">
</head>
<body style="margin-right: auto; margin-left: auto; width: 1000px;"
alink="#000088" link="#0000ff" vlink="#1b3789">
<div id="titel"><img
style="width: 1000px; height: 125px;" alt=""
src="Img/Logo2.png"></div>
<div id="menu1">&nbsp;<big
style="color: rgb(0, 0, 0);"><big><br>
<br>
<br>
&nbsp;<a href="index.html"><img
style="border: 0px solid ; width: 144px; height: 28px;" alt=""
src="Img/start.png"></a><br>
<br>
<br>
<br>
<a href="Projekthaupt.html"><img
style="border: 0px solid ; width: 144px; height: 28px;" alt=""
src="Img/projekte2.png"></a><br>
<br>
<br>
<br>
<a href="leistungen.html"><img
style="border: 0px solid ; width: 144px; height: 28px;" alt=""
src="Img/leistungen.png"></a><br>
<br>
&nbsp;<br>
<br>
<img style="width: 144px; height: 28px;" alt=""
src="Img/Partner2.png"><br>
<br>
<br>
<br>
<img style="border: 0px solid ; width: 144px; height: 28px;"
alt="" src="Img/Kontakt.png"><br>
<br>
<br>
<br>
<a href="impressum.html"><img
style="border: 0px solid ; width: 144px; height: 28px;" alt=""
src="Img/Impressum.png"></a><br>
<br>
<br>
&nbsp;<br>
</big></big></div>
<div id="inhalt">
<ul>
  <li><a class="fotoa galerie" href="#nogo"><span><img
src="img/beutin/beu01.jpg" alt="Holztür"
style="width: 372px; height: 240px;"><br>
Holztür im Natursteintorbogen</span></a></li>
  <li><a class="fotob galerie" href="#nogo"><span><img
style="width: 372px; height: 240px;" alt="Wintergarten"
src="img/beutin/beu02.jpg"><br>
Dachausbau </span></a></li>
  <li><a class="fotoc galerie" href="#nogo"><span><img
style="width: 372px; height: 240px;"
alt="Dachausbau Detailansicht" src="img/beutin/beu03.jpg"><br>
Dachausbau Detailansicht</span></a></li>
  <li><a class="fotod galerie" href="#nogo"><span><img
style="width: 372px; height: 240px;"
alt="Dachausbau Innenansicht" src="img/beutin/beu04.jpg"><br>
Dachausbau Innenansicht
    </span></a></li>
</ul>
</div>
<div id="menu2">&nbsp;
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
&nbsp;&nbsp;<br>
<br>
&nbsp;&nbsp;<br>
<br>
&nbsp;&nbsp;<br>
<br>
&nbsp;&nbsp;<br>
<br>
&nbsp;&nbsp;<br>
<br>
&nbsp; &nbsp; &nbsp;</div>
<div id="footer">&nbsp;&nbsp;<img
style="width: 1000px; height: 150px;" alt=""
src="Img/Adresse1.png">&nbsp; &nbsp;</div>
</body>
</html>
Zuletzt geändert von gimp-michel am Do 11. Feb 2010, 12:15, insgesamt 1-mal geändert.
Grund: Code in einen Codeblock verschoben
h.r.
 
Beiträge: 1
Registriert: Do 11. Feb 2010, 10:27

Re: Tutorial – Bilder-Galerie nur mit CSS (I)

Beitragvon gimp-michel » Do 11. Feb 2010, 12:18

Bitte überprüfe mal die Gross- und Kleinschreibung der Datei- und Pfadnamen, denn da hast du kein System drin. Das mög unter Windows noch laufen, aber ein richtiger Server macht da, berechtigter Weise, Unterschiede.
Gruß gimp-michel
Wenn Windows die Antwort ist, wie dämlich war dann die Frage?

Benutzeravatar
gimp-michel
Administrator
 
Beiträge: 3137
Registriert: Mo 7. Jan 2008, 00:24

Re: Tutorial – Bilder-Galerie nur mit CSS (I)

Beitragvon Arran » Do 11. Feb 2010, 13:13

Hallo

Noch etwas: bitte gewöhne Dir an, IMMER das "alt"-Feld bei den Bildern auszufüllen (und zwar nicht mit dem Bildnamen, sondern eine Bildbeschreibung). Das ist für die Suchmaschinen sehr wichtig, aber auch für Leute, die ihre Grafik auf dem PC abgestellt haben, sei es weil sie sehbehindert sind, oder eine extrem langsame Verbindung haben. Die Suchmaschinen erachten Seiten, die die W3C-Kriterien nicht erfüllen, als zweitklassig und fehlende gefüllete "alt"-Felder ergeben nun mal Fehler bei der HTML-Validierung. Das Ausfüllen geht am einfachsten während dem Einbinden des Bildes im KompoZer.

Und noch etwas: Wenn Du Bildergrössen per CSS oder HTML vorgibst, denn mache Dein Bild im Gimp auf diese genaue Grösse; man verliert etwa 50% der Bildqualität, wenn der Browser skalieren muss.

So, und nun sind wir auf den Link zu Deiner Webseite gestossen. Im Web habe ich mal mit "Zimmerei Hans Rausch" noch keine Seite gefunden...
Benutzeravatar
Arran
 
Beiträge: 815
Registriert: Di 15. Jan 2008, 01:39
Wohnort: Whiting Bay, Isle of Arran, Schottland

Vorherige

Zurück zu KompoZer-Tutorien

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 1 Gast