nicht angemeldet
div-Tags auslagern.
Moin, ch habe folgendes Problem, ich habe es zwar geschafft mir ein div-tag zu basteln, das auch funzt, aber wie kann ich das in eine externe Datei auslagern, damit ich es nicht für jeden Menupunkt, neu schreiben muss und so die Seite unnötig vergrössere. Hier mein Werk, das ich gerne auslagern würde:
<div style="border: 1px solid #CFD4C8; width: 128px; background: #CFD4C8; margin-left: 12px;" onmouseover="this.style.border='1px solid #000000'; this.style.background='#6B7954';"
onmouseout="this.style.border='1px solid #CFD4C8'; this.style.background='#CFD4C8';">
Kann mir irgendwer helfen? Wie bekomme ich das nach aussen?
Grüsse
Marc
-
Moin, ch habe folgendes Problem, ich habe es zwar geschafft mir ein div-tag zu basteln, das auch funzt, aber wie kann ich das in eine externe Datei auslagern, damit ich es nicht für jeden Menupunkt, neu schreiben muss und so die Seite unnötig vergrössere.
Wie man CSS-Angaben in einer zentralen Datei lagert, steht gleich um die Ecke im CSS-Kapitel von SelfHTML: http://selfhtml.teamone.de/css/formate/index.htm.
Das <div> selber kannst Du nicht auslagern - wie auch, es gehört schließlich zum Dokumententext. Es gibt in HTML keine Möglichkeit, ein Dokument aus mehreren Dateien zusammenzusetzen.
Du kannst höchstens auf Server-Funktionen wie Server Side Includes zurückgreifen. Wie die arbeiten, findest Du in der Anleitung zu Deinem Webserver, für den Apache beispielsweise unter http://httpd.apache.org/docs/mod/mod_include.html.
Gruß,
soenk.e-
Wie man CSS-Angaben in einer zentralen Datei lagert, steht gleich um die Ecke im CSS-Kapitel von SelfHTML: http://selfhtml.teamone.de/css/formate/index.htm.
Ne CSS habe kann ich auslagern, aber am konkreten beispiel, was kann ich von meinem tag, wie am besten auslagern, das verstehe ich immer noch nicht so ganz...
Das <div> selber kannst Du nicht auslagern - wie auch, es gehört schließlich zum Dokumententext. Es gibt in HTML keine Möglichkeit, ein Dokument aus mehreren Dateien zusammenzusetzen.
Muss ja auch nicht sein, war vielleicht etwas ungut ausgedrückt. ich stell mir halt einfach sowas vor wie ich es auch mit normalen CSS Angaben machen kann, das ich die in einer externen Datei definiere und dann nur ein kurzes (platzsparendes) tag brauch um den Kram zu verwenden.
Du kannst höchstens auf Server-Funktionen wie Server Side Includes zurückgreifen. Wie die arbeiten, findest Du in der Anleitung zu Deinem Webserver, für den Apache beispielsweise unter http://httpd.apache.org/docs/mod/mod_include.html.#
hmm, das macht die Datei für den User im Endeffekt aber auch nicht kleiner, oder?
-
Yo!
Wie man CSS-Angaben in einer zentralen Datei lagert, steht gleich um die Ecke im CSS-Kapitel von SelfHTML: http://selfhtml.teamone.de/css/formate/index.htm.
Ne CSS habe kann ich auslagern, aber am konkreten beispiel, was kann ich von meinem tag, wie am besten auslagern, das verstehe ich immer noch nicht so ganz...
Alles, was innerhalb von style steht, kannst du direkt copy+paste in eine externe CSS-Datei packen. Dazu muß dort natürlich noch ein wenig Verpackung: Geschweifte Klammern drumrum, und ein sogenannter Selektor davor (der sagt, für was das die Formatierung ist).
Sinnvollerweise nimmt man, wenn man <div>s hat, eine Klasse (für mehrfache Anwendung) oder eine ID (für einmalige Anwendung pro Datei).
Das <div> verliert dann das style-Attribut, und erhält ein class- oder id-Attribut.
Es ist aber in der Regel sinnvoll, nicht wild drauflos zu formatieren, sondern sich ein wenig Gedanken zu machen, welche Formatierungen für Klassen geeignet sind, und welche für IDs. Ich halte es so, daß IDs ganz schlicht für den Zugriff via Javascript benötigt werden, also enthält die ID-Formatierung nur die Positionierung des Layers (der ist einmalig im Dokument, und meist auch einmalig in der Position). Aussehen (Schriftart, -farbe etc) wird per Klasse definiert.
Am Ende hast du <div class="deineklasse" onmouseover...> stehen, und im CSS
.deineklasse { daswasehemalsinstyle="..."stand }Die onmouse...-Geschichten kriegst du vielleicht mit der Pseudoklasse :hover ersetzt - verlasse dich aber nicht darauf. Gewisse Dinge müssen einfach lang ausgeschrieben werden, anders gehts nicht.
- Sven Rautenberg
-
-
-
Hi, Marco
<div style="border: 1px solid #CFD4C8; width: 128px; background: #CFD4C8; margin-left: 12px;" onmouseover="this.style.border='1px solid #000000'; this.style.background='#6B7954';"
onmouseout="this.style.border='1px solid #CFD4C8'; this.style.background='#CFD4C8';">Packe alle CSS-Definitionen in einen einen Style-Bereich, definiere am besten ein -> Individualformat. Die MouseOver-Funktionalität kannst du mit :hover nachbilden, siehe -> Pseudoformate. Das funktioniert aber in den meisten Browsern nur bei <a>-Tags.
Alle Informationen hierzu findest du in <[link:/selfhtml/css/formate/zentrale.htm>]
LG Orlando