HP umgestalten mit CSS

    So habe jetzt fleißig :wink: gearbeitet und mal das Grundgerüst, sowie die ersten Seiten erstellt.


    Bevor ich mich jetzt an die Ausarbeitung und Darstellung von Text, sowie das einfügen der doch vielen Bilder waage, wollte ich lieb bitten :D nochmal einen Blick darauf zu werfen ob ich bis hierhin alles richtig verstanden habe?

    Nicht daß ich std.lang am PC sitze und dann alles verwerfen muss.

    Ach noch eine Frage: müssen die mit dreamwaver erstellten und bei den Dateien benutzten Vorlagen mit hochgeladen werden?

    Ganz lieben Dank für die Hilfe
    brigi 03
    http://home.arcor.de/deschner-clan/

    Füge noch das in den Headbereich ein, dann ist die Seite valide:

    Code
    <meta http-equiv="Content-Style-Type" content="text/css">

    Die CSS-Datei gehört noch etwas aufgeräumt. Da sind noch etliche überflüssige Angaben enthalten:

    Wenn du die Schriftart in den body schreibst (was der Fall ist), kannst du sie in allen anderen Elementen löschen. Das ist ja der Vorteil von CSS, dass sich derartige Angaben auf die nachfolgenden Elemente "vererben".

    text-align : left; ist auch überall überflüssig, da es der Standardeinstellung entspricht.

    Wenn das

    Code
    text-decoration : none;
	font-weight : bold;

    im a:link steht, kannst du es bei visitied, hover und active löschen.

    Bei #wrap kannst du das löschen, da Standardeinstellung: padding : 0;

    Bei den meisten Elementen ist auch das überflüssig, da Standardeinstellung:

    Code
    margin : 0; 
	padding : 0;

    Möglicherweise gibt es noch weitere Angaben, auf die man verzichten kann, hab jetzt nicht alles genau durchgesehen. Versuche mal, auf diese Weise die CSS-Datei noch etwas aufzuräumen und zu kürzen.
    Aber das sind eher Kleinigkeiten.

    Auf dieser Seite http://home.arcor.de/deschner-clan/Url2007Dez/rbericht.htm würde ich bei den Reiseberichten nicht nur die kleine Flaggen-Grafik als Link anbieten, sondern auch den entsprechenden Text dazu.
    Wie's geht ist hier erklärt.

    Das alles sind eher Kleinigkeiten. Insgesamt sieht's recht ordentlich aus.

    Hi,
    ich steh mal wieder auf dem Schlauch und hoffe, daß wieder jemand so lieb ist und mir weiterhelfen kann.

    Bisher hatte ich die fotos (insges ü 1000 auf xSeiten) jeweils in Tabellen eingebaut und mit Klick zum Vergrößern gebracht. Es öffnet sich dann immer ein neues Fenster welches man wieder schließen muß. Außerdem ist es schon eine immense Tipparbeit.

    Ein Beispiel wäre hier anzusehen:
    http://home.arcor.de/deschner-clan/Url2007Dez/tag02.htm

    Alles was ich bisher gefunden hab sind sog. Bildergalerien - aber fast alles in für mich unverständlichem engl. (Ich schäme mich ja schon :wink: )

    Für eine Lösung bedanke ich mich schon mal im Voraus

    liebe Grüsse
    brigi03

    brigi03,

    ja das wäre zwar eine klassische Tabellenanwendung - ich vermeide aber gern Tabellen http://www.harz-achat.de/achate.html . Wenn Du Dir den Quellcode ansiehst:

    dann siehst Du, was ich meine. Lightbox http://www.huddletogether.com/projects/lightbox2/ sorgt dann für den Popup-Effekt.

    Hallo Yeti,

    irgendwie stell ich mich wieder an..., wäre lieb wenn Du mir auf die Sprünge helfen könntest.

    Hab mir die lightbox geladen, 1 Ordner erstellt - js - da die Dateien reinkopiert, ebenso die image-Dateien, sowie die Angaben im Head.

    Das ganze mal mit einem Bild ausprobiert, aber irgendwie funzt es bei mir nicht so richtig. Das Bild geht zwar in extra Fenster auf, aber nicht so wie bei Dir. Außerdem verlasse ich dadurch meine Seite!

    vielen Dank
    brigi03
    P.S. Respekt vor Deiner Seite, find ich super :D

    Hi,

    danke, habe den Fehler selbst gefunden :wink:

    habe aber bevor ich mir wieder falsche Arbeit leiste noch eine Frage:

    Spricht eigentlich was gegen Tabellen bei den Bildern (wollte es eigentlich wegen der Rahmen :wink: )

    Liebe Grüsse und schönes Wochenende
    brigi

    also bei mir tut es :lol:
    das einzige was fehlt ist das close-Sign, da weiß ich aber noch nicht wie ich das hinkriegen soll? (liegt mit Sicherheit an meiner Ordnerstruktur) und kann im Zweifel damit leben.

    Vielleicht mußt die Seite neu laden?

    Gruß

    Moin,

    Zitat von JohnCena

    Ne tuts ned

    Tabellen sind für tabellarische Daten und in diesem Falle semantisch völlig falsch.

    Der Rahmen für die Bilder wird ganz normal in der CSS-Datei per border definiert.

    Man sollte allerdings vorher oben in der CSS-Datei erstmal den Rahmen um Bilder und für verweissensitive Bilder ausschalten, sonst kann es wegen der unterschiedlichen Default-Einstellungen der Browser zu Darstellungsproblemen kommen:

    Code
    img  {
	border:none;
}
a img  {
    border:none;
}

    koslowski

    Hallo,

    tut mir wirklich leid - bin Anfänger - und verstehe nur Bahnhof :roll:

    @Yeti,

    habe nun noch ein Problem, vielleicht kannst Du helfen?

    Bei den normalen Bildern geht alles, aber bei Hochkant-Bilder sieht es grauslig aus.
    Hab von Javascript Null-Ahnung und möchte da nicht einfach rumbasteln.
    http://home.arcor.de/deschner-clan/Url2007Dez/tag02.htm

    Auch das close.gif findet er nicht, ist aber im selben Ordner wie pref.giv etc. - und das geht. :?:

    Vielen Dank schon mal
    brigi03

    brigi03,

    1. Kontrolliere Deine Links

    Code
    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>


    Hier liegen alle JScripte im "js" Ordner und die CSS Datei im "css" Ordner. Wenn Du alles in einen Ordner legst "lightbox" z.B. muß es so aussehen:

    Code
    <link rel="stylesheet" href="lightbox/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox/prototype.js"></script>
<script type="text/javascript" src="lightbox/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="lightbox/lightbox.js"></script>

    brigi03,


    ah ich habe mal wieder nicht zu Ende gelesen. Der Schwarze Streifen ist natürlich M...:wink: nicht erwünscht. Auf den ersten Blick sehe ich nur, das Du

    Code
    ....ptaculous.js?load=effects,builder"></script>

    den ,builder als Parameter zusätzlich hast. Ich schaffe es heute Abend nicht mehr und muss/darf morgen auf 1Woche Schulung nach Hannover. Erinnere mich bitte nochmal mit einer PN, dann sehe ich es mir nochmal an.

    brigi03,

    also wenn Du die Standartordner, wie entpackt verwendest und im <head>Bereich

    Code
    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" >


<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

    einfügst funktioniert alles tadellos :wink:

    hallo Yeti66,

    ohne das "builder" geht garnichts, habs also wieder reingetan.
    Du warst so schnell, daß ich mit dem neuen upload noch garnicht fertig war :wink:

    Jetzt dürfte aber alles o.k. sein.


    Ganz vielen lieben Dank
    brigi

    brigi03,

    nee,nee da geht noch nichts. Halte Dich doch an die Anleitung auf der Seite. Eigentlich kann man da doch nichts verkehrt machen.
    Außerdem zerhaut es Dir Deine Navi (oben quer) ab der Reiseberichtseite Mai 2005. Mal sehen ob ich am Wochenende Zeit habe, dann mache ich Dir mal eine Musterseite, wie ich mir das vorstellen könnte mit lightbox.

    Hallo Yeti66,

    danke für den Hinweis.
    Ich Dödel hab doch vor lauter Änderungen vergessen die berichtigten Unterseiten hochzuladen. So dürfte das zerschossene Menue oben jetzt erledigt sein.

    Zitat

    Halte Dich doch an die Anleitung auf der Seite. Eigentlich kann man da doch nichts verkehrt machen.

    Also ich dachte schon, daß ich das getan hätte. Habs von dieser Seite geladen
    http://www.lokeshdhakar.com/projects/lightbox2/
    und da ist das auch so mit dem builder.

    Code
    Mal sehen ob ich am Wochenende Zeit habe, dann mache ich Dir mal eine Musterseite, wie ich mir das vorstellen könnte mit lightbox.


    Darüber würde ich mich natürlich riesig freuen.
    Vielleicht klappts ja dann doch noch,daß ich auch 580px Hochformatbilder ohne scrollen reinbringe? Sonst muß ich nämlich alle Bilder auf der bisherigen Seite ändern! (Was ich ja bei den Neuen vom Dez 2007 auf der Musterseite jetzt getan hab)

    Einstweilen vielen Dank und lieben Gruß
    brigi03

    brigi03,

    oh, ja mein Fehler ich habe noch die Version Lightbox2 v2.03.3 getestet und auf der Website in Verwendung und Du hast Lightbox2 v2.04 genutzt. Deshalb der .... ,builder... Naja muss ich selber erst mal testen aber da es nur eine Fehler bereinigte Version ist (wenn ich das hier so überfliege), sollte der Unterschied nicht so groß sein. Samstag oder vielleicht Freitag Abend sehe ich es mir mal an.

    Hi yeti66,

    ist schon o.k. :wink:
    wenn es Dir am Wochenende möglich ist, freu ich mich natürlich (hab schon ein schlechtes Gewissen :wink: )

    Bin eh schier am verzweifeln, wenn ich mir die Seite hier anschaue
    http://browsershots.org/http://home.ar…07Dez/tag02.htm

    Hab mich wirklich bemüht, es ist auch alles valide - aber das Ergebnis ist wirklich nicht schön. Bin wirklich am überlegen ob ich es nicht hinschmeiß und evtl. noch mit Tabellenlayout probiere. (mit Frames hatte ich keine Probl.)
    Liebe Grüsse
    brigi03

    brigi03,

    ok, wie versprochen aber leider schnell gemacht und noch nicht der Stein der Weisen klar, bei 4Stunden Arbeit. Sie es Dir erst einmal an und vergleiche die Links mit Deinen. Ob Du irgendwas daraus übernimmst ist ganz Deine Sache. Das 2. Bild für den header kann ich Dir auch noch in voller Breite zur Verfügung stellen. Die Bilder (header) sind in privater Nutzung Lizenzfrei .
    Bei Frage die über das Forum hinausgehen kannst Du mich unter der e-mailadresse im Titel erreichen. Gruß yeti

    Hi yeti66,

    erstmal ganz, ganz lieben Dank für Deine Riesen-Mühe. Werde es mir mal aufspielen und durchgehen (kann aber ein paar Tage dauern - habe diese Wo einige wichtige Termine u somit nur Nachts Zeit :wink: )

    Melde mich auf jeden Fall.

    Ein schönen Sonntag noch

    liebe Grüße
    brigi03