Gruppen
- Top Gruppen
- Betriebsysteme
- Windows classik
- Linux
- BS-Sonstige
- Software
- Datenbanken
- Bildbearbeitung
- Audio/mp3/Video
- Security/Viren
- SW-Sonstige
- Hardware
- Mainboard/CPU
- Grafikkarten
- Peripherie
- Laptop/Notebook
- HW-Sonstiges
- Netzwerk
- Telefon,ISDN,Modem
- W-Lan
- NW-Sonstiges
- Programmierung
- PHP,ASP,Perl...
- Java,C++...
- Webseiten/HTML
- Sonstiges
- PC-Sonstiges
- Plauderecke
- SN Intern
- Test
/ Forum / Webseiten/HTML
Webseiten/HTML
Fragevon brshna vom 23.05.2019, 11:16 Options
css frames; target vergeben?
hallo
ich bin gerade daran CSS "frames" zu erstellen... hab bis her 3 teile: einen hauptteil (body), einen header (top) und einen nav auf der linken seite (nav)...
nun habe ich folgendes problem: wenn ich in der nav einen link anklicke möchte ich dass das entsprechende html file im body teil erscheint.... wie mach ich das ?
bei den altmodischen frames ging das ja so:
name=ausgabe
und beim link musste man dann nur noch target="ausgabe" eingeben (z.b. <a href="http://www.supportnet.de" target="ausgabe">supportnet.de</a )
vielen dank für eure hilfe!
gruss brshna
ich bin gerade daran CSS "frames" zu erstellen... hab bis her 3 teile: einen hauptteil (body), einen header (top) und einen nav auf der linken seite (nav)...
nun habe ich folgendes problem: wenn ich in der nav einen link anklicke möchte ich dass das entsprechende html file im body teil erscheint.... wie mach ich das ?
bei den altmodischen frames ging das ja so:
name=ausgabe
und beim link musste man dann nur noch target="ausgabe" eingeben (z.b. <a href="http://www.supportnet.de" target="ausgabe">supportnet.de</a )
vielen dank für eure hilfe!
gruss brshna
Antwort 1 von Ralfman vom 23.05.2019, 11:27 Options
Hi brshna,
um Dir effektiv weiterhelfen zu können währ's schon gut den Quellcode mal anschauen zu können, um die Fehler zu fenden.
Hast Du die bisher fertigen Seiten schon irgendwo hochgeladen?
Ralf
um Dir effektiv weiterhelfen zu können währ's schon gut den Quellcode mal anschauen zu können, um die Fehler zu fenden.
Hast Du die bisher fertigen Seiten schon irgendwo hochgeladen?
Ralf
Antwort 2 von rabies_ vom 23.05.2019, 11:46 Options
CSS hat nichts mit Frames zu tun. Aber auch wirklich gar nichts.
Du solltest Dich, zeitgemäß, vom Konzept der Frames verabschieden, wenn Du schon Markup ((X)HTML) und Layout (CSS) trennst.
Grundlegend wird erst einmal jede Seite komplett neu geladen. Nicht nur Teilbereiche, wie es bei Frames so üblich ist/war.
Sprich: Du baust Dir erst einmal ein Grundgerüst Deiner Seite auf, wo die feststehende Navigation, der Header, Footer, Content (, uswusf) drin ist. Diese Datei nimmst Du als Vorlage für alle weiteren Dateien, in die Du dann nachfolgend den Content einpflegst.
--rabies.
Du solltest Dich, zeitgemäß, vom Konzept der Frames verabschieden, wenn Du schon Markup ((X)HTML) und Layout (CSS) trennst.
Grundlegend wird erst einmal jede Seite komplett neu geladen. Nicht nur Teilbereiche, wie es bei Frames so üblich ist/war.
Sprich: Du baust Dir erst einmal ein Grundgerüst Deiner Seite auf, wo die feststehende Navigation, der Header, Footer, Content (, uswusf) drin ist. Diese Datei nimmst Du als Vorlage für alle weiteren Dateien, in die Du dann nachfolgend den Content einpflegst.
--rabies.
Antwort 3 von rfb vom 23.05.2019, 11:56 Options
Zitat:
wie mach ich das ?
mit HTML? Gar nicht!wie mach ich das ?
Wenn du die Quelltexte für Header, Navigation und Content (die üblicheren Bezeichnungen - body hat schon eine andere Bedeutung) separat verwalten willst kannst du dies serverseitig per PHP machen (Stichworte include und readfile).
Einzelne Teile einer Seite nachladen kannst du allenfalls per AJAX, da dies aber auf JavaScript basiert ist es entsprechend absolut unzuverlässig und für wesentliches unbrauchbar.
Antwort 4 von brshna vom 23.05.2019, 13:51 Options
also das was ich bis jetzt geschafft habe findet ihr hier: Link zu meinem Projekt
aber etwas ist noch komisch, beim IE sieht das katastrophal aus und beim firefox siehts so aus wie es sollte... also evtl. mit beiden browsern mal nachschauen...
gruss und danke für eure Hilfe!
eure brshna
aber etwas ist noch komisch, beim IE sieht das katastrophal aus und beim firefox siehts so aus wie es sollte... also evtl. mit beiden browsern mal nachschauen...
gruss und danke für eure Hilfe!
eure brshna
Antwort 5 von rfb vom 23.05.2019, 14:08 Options
der Quellcode steckt voller Fehler (W3C-Validator), außerdem schickst du den IE absichtlich in den Quirksmodus. Da kann es schon mal passieren, dass die Seite völlig anders aussieht als gewünscht.
Antwort 6 von brshna vom 23.05.2019, 14:15 Options
hm.... was ist denn der dieser Quirksmodus genau? was bewirkt er? =s sorry wenn ich so viele fragen hab....
Antwort 7 von brshna vom 23.05.2019, 14:38 Options
ok hab rausgefunden was der Quirksmodus ist und hab dies auch geändert auf http://www.6375.ch/test.html
Antwort 8 von Flupo vom 23.05.2019, 14:51 Options
Auf den ersten Blick sind mir im Quelltext drei Blöcke mit CSS-Style-Definitionen aufgefallen, die zu einem zusammengefasst werden sollten.
Darüberhinaus fehlt beim zweiten (beginnt nach dem Textfiller-Script) die Typangabe und der dritte ist im <body> gelandet, wo er nichts zu suchen hat.
Wenn die Designphase halbwegs abgeschlossen ist, empfehle ich auch die Auslagerung der Styles in eine separate Datei. Das macht den Rest übersichtlicher.
Body als id zu verwenden, halte ich auch für etwas ungünstig. Wenn die Formatierung für den ganzen Body gelten soll, dann ergänze oben die entsprechenden Formatierungen.
Auch nicht sehr schick, sind die Positionierungen per <br />. Soetwas macht man besser per margin oder padding. Hierbei ist nur wieder blöd, dass der IE in dem Bereich ne Macke hat und das falsch darstellt.
Auch innerhalb der Styles sind einige Böcke. Zum Beispiel wird #framecontentTop zweimal und z.T. unterschiedlich definiert. #framecontentLeft wird definiert, aber nicht verwendet...
Du wirst wohl noch ein Stündchen investieren müssen. ;-)
Gruß Flupo
Darüberhinaus fehlt beim zweiten (beginnt nach dem Textfiller-Script) die Typangabe und der dritte ist im <body> gelandet, wo er nichts zu suchen hat.
Wenn die Designphase halbwegs abgeschlossen ist, empfehle ich auch die Auslagerung der Styles in eine separate Datei. Das macht den Rest übersichtlicher.
Body als id zu verwenden, halte ich auch für etwas ungünstig. Wenn die Formatierung für den ganzen Body gelten soll, dann ergänze oben die entsprechenden Formatierungen.
<div id="body">...</div>Auch nicht sehr schick, sind die Positionierungen per <br />. Soetwas macht man besser per margin oder padding. Hierbei ist nur wieder blöd, dass der IE in dem Bereich ne Macke hat und das falsch darstellt.
Auch innerhalb der Styles sind einige Böcke. Zum Beispiel wird #framecontentTop zweimal und z.T. unterschiedlich definiert. #framecontentLeft wird definiert, aber nicht verwendet...
Du wirst wohl noch ein Stündchen investieren müssen. ;-)
Gruß Flupo
Antwort 9 von brshna vom 23.05.2019, 15:14 Options
also hab jetzt die fehler die W3 - Validator
vorhin entdeckt hat behoben... hab auch alle tipps von Flupo bearbeitet und die fehler behoben..
vielen dank bis hierhin...
nun ist aber immer noch das problem mit der ausgabe... kann ich dafür ein div container definieren der dann die html files ausgibt, oder ist das keine gute idee?
gruss brshna
vorhin entdeckt hat behoben... hab auch alle tipps von Flupo bearbeitet und die fehler behoben..
vielen dank bis hierhin...
nun ist aber immer noch das problem mit der ausgabe... kann ich dafür ein div container definieren der dann die html files ausgibt, oder ist das keine gute idee?
gruss brshna
Antwort 10 von rfb vom 23.05.2019, 15:29 Options
Zitat:
oder ist das keine gute idee
das ist einfach nicht möglich! Das hatten wir aber jetzt nun wirklich oft genug geschrieben. Und um es zusammenzufassen: GEHT NICHT!oder ist das keine gute idee
Antwort 11 von rfb vom 23.05.2019, 15:33 Options
Übrigens: mit den Layouttabellen und veralteten HTML-Layout-Attributen bist du vom Ziel eines CSS-basierten Layouts noch sehr sehr weit entfernt.
Antwort 12 von brshna vom 23.05.2019, 15:35 Options
ich bin ja noch am lernen... und man muss nicht überall perfekt sein...
Antwort 13 von Flupo vom 23.05.2019, 18:50 Options
Es wird doch. *applaus*
Ein bisschen Ordnung im Quelltext und schon kommt auch der IE damit klar. ;-)
Den Header würde ich nochmal neu machen (und im Quelltext auch nach oben ziehen). Im Moment verschwinden die Links oben rechts nämlich wenn man eine Auflösung kleiner 1024er Breite verwendet.
Die Klasse buttoncontainer ist überflüssig. Du musst nur die Breitenangabe zu den buttons verschieben (habs ausprobiert).
<span class="Stil1"></span> tut nix, kann also weg. Ebenso der zugehörige CSS-Abschnitt.
Wie man den gesamten CSS-Abschnitt in eine separate Datei auslagert, kannst du hier nachlesen.
Gruß Flupo
Ein bisschen Ordnung im Quelltext und schon kommt auch der IE damit klar. ;-)
Den Header würde ich nochmal neu machen (und im Quelltext auch nach oben ziehen). Im Moment verschwinden die Links oben rechts nämlich wenn man eine Auflösung kleiner 1024er Breite verwendet.
Die Klasse buttoncontainer ist überflüssig. Du musst nur die Breitenangabe zu den buttons verschieben (habs ausprobiert).
<span class="Stil1"></span> tut nix, kann also weg. Ebenso der zugehörige CSS-Abschnitt.
Wie man den gesamten CSS-Abschnitt in eine separate Datei auslagert, kannst du hier nachlesen.
Gruß Flupo
Antwort 14 von rfb vom 24.05.2019, 08:46 Options
<html> fehlt!
dafür ist so einiges völlig überflüssig:
<td width="276" align="center" valign="middle"><div align="center" class="Stil1">
<p>Das Internet Portal für die Postleitzahl 6375 </p>
</div> </td>
sowohl div als auch p werden hier nicht gebraucht, wenn du unbedingt eine Layouttabelle nutzen willst.
nur mal so als Hinweis:
<div class="buttonscontainer">
<div class="buttons">
<p><a href="home.html" target="ausgabe">Home</a>
<a href="angebote.html" target="ausgabe">Unsere Angebote</a>
<a href="referenzen.html" target="ausgabe">Referenzen</a>
<a href="anmeldung.html" target="ausgabe">Anmeldung</a>
<a href="login.html" target="ausgabe">Mitglieder Login</a>
<a href="kontakt.html" target="ausgabe">Kontakt</a>
<a href="impressum.html" target="ausgabe">Impressum</a></p>
</div>
</div>
mache doch besser daraus das was es ist: eine Liste von Links
und schmeiss das target-Attribut endlich raus!
dafür ist so einiges völlig überflüssig:
<td width="276" align="center" valign="middle"><div align="center" class="Stil1">
<p>Das Internet Portal für die Postleitzahl 6375 </p>
</div> </td>
sowohl div als auch p werden hier nicht gebraucht, wenn du unbedingt eine Layouttabelle nutzen willst.
nur mal so als Hinweis:
<div class="buttonscontainer">
<div class="buttons">
<p><a href="home.html" target="ausgabe">Home</a>
<a href="angebote.html" target="ausgabe">Unsere Angebote</a>
<a href="referenzen.html" target="ausgabe">Referenzen</a>
<a href="anmeldung.html" target="ausgabe">Anmeldung</a>
<a href="login.html" target="ausgabe">Mitglieder Login</a>
<a href="kontakt.html" target="ausgabe">Kontakt</a>
<a href="impressum.html" target="ausgabe">Impressum</a></p>
</div>
</div>
mache doch besser daraus das was es ist: eine Liste von Links
<ul id="navigation">
<li><a ...>Linktext</a></li>
...
</ul>und schmeiss das target-Attribut endlich raus!
Antwort 15 von brshna vom 24.05.2019, 12:44 Options
also... hab das ganze noch einmal überarbeitet... das mit der link liste hab ich soweit.... aber wie benamse ich jetzt die Styles um? die heissen ja jetzt
kann einfach .buttonscontainer in .navigation umschreiben?
..buttonscontainer {width: 150px;}
.buttons a {
background-color: #A09CD0;
padding: 2px;
padding-left: 3px;
display: block;
border-left: 10px solid #655FB2;
font: 13px Tahoma, sans-serif;
font-weight: bold;
text-decoration: none;
text-align: left;
margin-top: 1px;
margin-left: 15px;}
.buttons a:hover {border-left: 10px solid #F5F424;
text-decoration: none;
color: #0033CC;}
kann einfach .buttonscontainer in .navigation umschreiben?
Antwort 16 von rfb vom 24.05.2019, 13:03 Options
wenn die Elemente a im Element ul mit der Id navigation liegen ist die korrekte Syntax.
oder
oder
oder
(die unterscheiden sich noch etwas hinsichtlich ihrer Spezifität, was bei dir aber keine Rolle spielen sollte)
#navigation a {... }oder
ul#navigation a {... }oder
ul#navigation li a {... }oder
#navigation li a {... }(die unterscheiden sich noch etwas hinsichtlich ihrer Spezifität, was bei dir aber keine Rolle spielen sollte)
.navigation class="navigation"id="navigation"Antwort 17 von Flupo vom 24.05.2019, 13:04 Options
Ich zitiere mich mal:
Damit meine ich, dass die eine Zeile bei .buttoncontainer (width: 150px;) drei Zeilen weiter runter verschoben wird. .buttoncontainer kann dann ganz raus.
Da du unten jetzt dem Navi-div die id navigation verpasst hast, fehlt jetzt dafür ein entsprechender CSS-Abschnitt. Mache aus .buttons .navigation.
Gruß Flupo
Zitat:
Die Klasse buttoncontainer ist überflüssig. Du musst nur die Breitenangabe zu den buttons verschieben (habs ausprobiert).
Die Klasse buttoncontainer ist überflüssig. Du musst nur die Breitenangabe zu den buttons verschieben (habs ausprobiert).
Damit meine ich, dass die eine Zeile bei .buttoncontainer (width: 150px;) drei Zeilen weiter runter verschoben wird. .buttoncontainer kann dann ganz raus.
Da du unten jetzt dem Navi-div die id navigation verpasst hast, fehlt jetzt dafür ein entsprechender CSS-Abschnitt. Mache aus .buttons .navigation.
Gruß Flupo
Antwort 18 von brshna vom 24.05.2019, 13:06 Options
habs jetzt anders gelöst... habs einfach so gemacht:
klappt von den farben her auch ganz gut.... nur diese hässlichen punkte voran... kann man die noch irgendwie weglassen?
gruss brshna
<ul id="navigation" class="buttons" style="width:150px;">
<li><a href="index.html">Home</a></li>
<li><a href="angebote.html">Unsere Angebote</a></p></li>
<li><a href="referenzen.html">Referenzen</a></p></li>
<li><a href="anmeldung.html">Anmeldung</a></p></li>
<li><a href="login.html">Mitglieder Login</a></p></li>
<li><a href="kontakt.html">Kontakt</a></p></li>
<li><a href="impressum.html">Impressum</a></li>
</ul>
klappt von den farben her auch ganz gut.... nur diese hässlichen punkte voran... kann man die noch irgendwie weglassen?
gruss brshna
Antwort 19 von Flupo vom 24.05.2019, 13:06 Options
Zitat:
.navigation würdest du benutzen, wenn du class="navigation" im HTML hättest. Da es aber nur eine Navigation gibt ist eine id="navigation" und damit die obere Syntax sinnvoller.
.navigation würdest du benutzen, wenn du class="navigation" im HTML hättest. Da es aber nur eine Navigation gibt ist eine id="navigation" und damit die obere Syntax sinnvoller.
Du hast natürlich Recht. *schäm*
Ich hau die Klassen und ID's immer gern durcheinander.
Gruß Flupo
Ähnliche Themen
Quelcode in ein macro einbinden
$KGB$ 08.01.2007 - 104 Hits - 1 Antwort
Frames
ThomyBroty 20.05.2007 - 135 Hits - 8 Antworten
Verweis nur anzeigen wenn Variable true ist
jessica 25.07.2007 - 25 Hits - 4 Antworten
Worksheet_Change funktioniert nicht so wie ich es mir vorstelle
Saarbauer 14.08.2007 - 61 Hits - 4 Antworten
Dokumentieren von Zeilenänderungen
Johnsen 26.06.2008 - 31 Hits - 3 Antworten
Hinweis
Diese Frage ist schon etwas älter, Sie können daher nicht mehr auf sie antworten. Sollte Ihre Frage noch nicht gelöst sein, stellen Sie einfach eine neue Frage im Forum..
Neue Einträge
