• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

per frame eingebundene html wird nich in css dargestellt

Miglo

Miglo

Neues Mitglied
Hallo,

ich hab schon viel gesucht, aber nichts entsprechendes gefunden.

Ich habe eine home.html erstellt, in der ich per frameset Bereiche zuordne.
Innerhalb eines framesets binde ich per <frame src="menue.html" /> das "Menü" ein.

Die css wird per <link... /> bei beiden Dateien eingebunden.

Ich hab´ viel probiert, bis dato steht nur in der home.html folgender doctype:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
(insofern das was zu sagen hat...)

In der menue.html steht folgender code:

<div id="menue">
<p></p>
<a href="1.seite.html" target="inhalt">1. Seite</a><br />
<a href="2.seite.html" target="inhalt">2. Seite</a>
</div>

in der css steht:

#menue a {display:block; width:99%}
#menue a :link {text-decoration:none}
#menue a :visited {text-decoration:none}
#menue a :active {text-decoration:none}
#menue a :hover {text-decoration:underline; color:red}

Nun wird partou nicht die Formatierung, wie sie in der css-Datei steht angezeigt.

Was mache ich falsch?

Danke schon mal für eure Hilfe!

Gruß
Miglo

PS: Die Pfadangaben stimmen. Zu Anfang habe ich in der home.html lediglich Text hingeschrieben, der mit der bestehenden Pfadangabe per css zu formatieren war.
 
Hallo Miglo,
First things first: Du kannst deinen Text formatieren, indem du BB-Codes benutzt. Zweitens ist es total veraltet und fast schon verhasst, Frames zu benutzen. Ich würde dir deshalb empfehlen, gar nicht erst damit anzufangen, was mit Frames zu machen, sondern, wie du auch schon etwas gemacht hast, Divs und Spans zu benutzen.
Wenn es dir noch darum geht, dass es ja viel einfacher ist, Frames zu benutzen, als sich mit Divs abzugeben, kann ich dir nur raten, anstatt puren HTML-Dateien serverseitig kompilierte PHP-Dateien zu verwenden.
Um PHP zu lernen, würde ich dir PHP für dich empfehlen, dieses Tutorial ist vom gleichen Mensch, der auch SelfHTML gemacht hat. Ich hoffe, ich konnte dir helfen, auch wenn es nicht mehr um dein eigentliches Problem handelt.
htmltroll
 
Die Pseudostile (:hover) müssen direkt an den Tagnamen angrenzen (kein Leerzeichen):

Code: 
#menu a:hover { color: red; }

Die CSS-Datei muss in jeder Frameseite (etwa menue.html) eingebunden werden, nicht in der Frameset-Seite selbst.

Jede in einem Frame dargestellte Seite muss ein komplettes HTML-Dokument (mit DOCTYPE und allem) sein.

Setze sonst einfach testweise ein

Code: 
body { background: green; }

in die CSS-Datei. Dann wirst du schon merken, ob sie korrekt eingebunden wird. ;)
 
Hi!

Ich nochmal...

Ich hab mich entschlossen doch mit DIVs zu arbeiten, da ich viel Schlechtes über frames gelesen hab´. :)

Nun habe ich allerdins ein anderes Problem.

Die Seite ist recht einfach gestaltet:

Oben ein Header, links ein Menü, rechts der Content.

Den Frames konnte man einen Namen geben (z.B. <frame name="content" />) und im Menü <a href="irgendwas.html" target="content"> schreiben.
Auf diese Weise bleiben bei einem Klick in´s Menü der Header und das Menü stehen und nur der Content wird neu geladen.

Wie löse ich das Problem, wenn die Seite nun nur noch aus div-Containern besteht?
Das Attribut "name" haben die Dinger nämlich nicht. ;)


Gruß
Miglo

PS: php stellt im übrigen kein Problem dar. Soweit ich das verstanden habe, habe ich im Netz jedoch nur Beispiele gefunden, die per include html-Datein in ein und den gleichen div-Container einbinden. Das löst leider nicht mein Menü-Problem...
 
Zuletzt bearbeitet:
Hallo.

Zeichne dein Menü als Liste aus, verzichte auf divs wo sie nicht nötig sind und zeige uns mal deinen kompletten Code.

Gruss
Elroy
 
Schon mal danke für die schnelle Antwort!

hier der html-code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="XHTML namespace" xml:lang="de" lang="de">

<head>

<title>Kampfkunst-Studio M&uuml;nchen</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta name="description" content="" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<link href="http://localhost/verzeichnis/kampfkunst-studio/style.css" type="text/css" rel="stylesheet" />

</head>

<body>

<div class="site">

<!-- Header -->

<img id="header" src="bilder/logo.gif" border="" height="110" width="800" alt="logo" />
<div id="balken"><div id="titel">DAS KAMPFKUNKST-STUDIO</div>

<!-- Menü -->

<ul id="menue">
<li class="menue_link_1"><a href="Die Nr. 1 in Muenchen.html">DIE NR. 1 IN M&Uuml;NCHEN</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="Das Trainer-Team.html">DAS TRAINER-TEAM</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="x.html">DAS R&Auml;UMLICHKEITEN</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="x.html">MITGLIEDERBEREICH</a></li>
<li><hr class="linie" /></li>
<li><div class="menue_balken"><div class="trenner">KAMPFKUNST-DISZIPLINEN</div></div></li>
<li class="menue_link"><a href="x.html">KRAV MAGA</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="x.html">KUNG FU</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="x.html">LUTA LIVRE</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="x.html">TRAINING / TERMINE</a></li>
<li><hr class="linie" /></li>
<li><div class="menue_balken"><div class="trenner">KONTAKT &amp; MEDIEN</div></div></li>
<li class="menue_link"><a href="x.html">KONTAKT / ANFAHRT</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="x.html">FOTOS &amp; VIDEOS</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="x.html">B&Uuml;CHER</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="x.html">LINKS</a></li>
<li><hr class="linie" /></li>
<li><div class="menue_balken"><div class="trenner">IMPRESSUM / DATENSCHUTZ</div></div></li>
<li class="menue_link"><a href="x.html">IMPRESSUM</a></li>
<li><hr class="linie" /></li>
<li class="menue_link"><a href="x.html">DATENSCHUTZ</a></li>
<li><hr class="linie" /></li>
</ul>

<!-- Inhalt -->

<div class="content">HIER SOLLEN HTMLs EINGEBUNDEN WERDEN</div>

</div>
</div>
</body>
</html>

______________________________________________________________________________________________________________________


und hier die css:

.site {
text-align:center;
margin:0 auto;
position:relative;
}

#header {
margin:auto;
width:800px;
height:110px;
}

#balken {
margin:auto;
padding:0;
height:25px;
width:800px;
background-color:black;
color:white;
text-align:left;
font-family:arial;
font-size:12px;
font-weight:bold;
}

#titel {
padding-left:17px;
padding-top:5.5px;
}

ul#menue {
position:relative;
left:-39px;
float:left;
list-style-type:none;
width:200px;
}

a:link {
text-decoration:none;
color:black;
}

a:visited {
text-decoration:none;
color:black
}

a:hover {
text-decoration:none;
color:red;
}

.menue_link_1 {
margin-top:30px;
margin-bottom:10px;
text-align:left;
font-family:arial;
font-size:12px;
font-weight:bold;
padding-left:16px;
}

.menue_link {
margin-top:10px;
margin-bottom:10px;
text-align:left;
font-family:arial;
font-size:12px;
font-weight:bold;
padding-left:16px;
}

.linie {
margin-left:10px;
width:180px;
height:1px;
border:0;
color:black;
background-color:black;
}

.menue_balken {
height:25px;
margin-top:20px;
margin-bottom:20px;
font-family:arial;
font-size:12px;
font-weight:bold;
background-color:black;
color:white;
text-align:left;
}

.trenner {
padding-left:16px;
padding-top:5.5px;
}

.content {
position:relative;
left:200px;
width:598px;
height:699px;
border:1px solid #000;
color:black;
}

_______________________________________________________________________________________________________________________

Das Menü habe ich bereits als Liste geschrieben.
Jetzt müssen die Links nur noch auf den Inhalt des DIVs mit der Klasse "content" (ganz unten im html-code) zugreifen können.
Wie gesagt, bei Frames ging das mit "target".

Gruß
Miglo

PS: Das geübte Auge wird im Code wahrscheinlich jede Menge Unordnung entdecken.
Ich halte das mit der Programmierung nach dem Prinziep trial and error ;)
und css habe ich erst gestern das erste Mal so richtig auf dem Schirm gehabt...
 
Zuletzt bearbeitet:
Hab´ das Problem im "iframes" inzwischen gelöst. Hier kann man einen Namen einfügen und diese dann per "target" innerhalb des <a>-Tags ansteuern.

Trotzdem Danke für die Hilfe!

Gruß
 
Moin,

Deine Herangehensweise, alle Abstände und Formate mit px zu definieren funzt vermutlich recht gut, solange Du auf Deinem lokalen Rechner bleibst. Wenn Du jedoch spasseshalber mal die Auflösung, tatsächlich also den Viewport änderst, wirst Du feststellen, dass Deine px-Angaben starr sind, sich also nicht auf andere Viewports anpassen. Besser wäre hier die Angabe in em oder %.
Das trifft insbesondere auf Deine Klasse "Content" zu (wieso eigentlich nicht id, wie oft gibt´s bei Dir den Content ?), die bei eintsprechend grossem Monitor zum Miniatur-Content mutieren dürfte.
HTML: 
<link href="http://localhost/verzeichnis/kampfku...udio/style.css"  type="text/css" rel="stylesheet" />
Hier arbeite ich lieber mit Verlinkung im eigenen Baum, also z.B. ../css/kampfkunststudio/style.css. Ist allerdings nur meine "Macke". Nachteil bei Deiner Variante ist, dass Du den Link umschreiben musst, denn Du die Seite online stellst.
Bei den Links fehlen die alt-Texte.
Um Problemen bei verschiedenen Browsern, Browser- und Userstlesheets von Anfang an aus dem Wege zu gehen, kannst Du am Anfang der CSS noch
Code: 
* { margin:0; padding; }
einsetzen. Damit werden in allen Browsern (die mit CSS arbeiten) sämtliche Abstände auf "0" gesetzt.
font-family:arial ist keine Familie, da gehören, wie im echten Leben, immer mehrere dazu. Passend zu Arial wäre z.B. noch Verdana (die angeblich beliebteste Online"-Schrift) oder einfach die Gruppe sans-serif (übersetzt "ohne Serifen").
Das position:relative bei .content ist imho überflüssig. Ich würde das eher mit einem overflow:auto lösen. Dabei bleibt der Content als festes "Fenster" stehen und wenn der Inhalt länger ist als das definierte Fenster, entsteht ein vertikaler Scrollbalken.

Grüsse
low
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben