CSS zwei fragen
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
bestehen
blocken
code
datei
display
dokument
einbinden
extra
header
http
index
jemand
manager
regel
reihenfolge
setzen
sitzung
stehen
text
url
-
Also wie kann man test.css von html öffnen bzw.. aufrufen?
und wie
kann ich einen button mit mouseover machen?
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
1. Das hier
<link rel="stylesheet" type="text/css" href="test.css"/>
in den head deines dokuments schreiben.
2. Ja, da gibts ein schönes tutorial dazu :-)
http://www.lima-city.de/tutorials/mouseover-mit-css
Beitrag zuletzt geändert: 14.8.2010 20:06:22 von sideblog -
Eine CSS-Datei kannst du einbinden, indem du diesen Code in die Datei (vorzüglich in den Header) einfügst:
Du kannst CSS aber auch verwenden, indem du es einfach in die HTML-Datei dazu schreibst und Style-Tags (<style>Code</style>) vor und nach dem Code schreibst.<link rel="stylesheet" type="text/css" href="/css/all.css" />
Wie man Mouseovereffekte erstellt, erfährst du auf dieser Seite. -
tschecke nicht kann jemand vervollständigen:
code:
.css:
a.menu { display:block; margin-bottom:5px; text-align:center; width:16ex;
border-style:ridge; border-width:3px; padding:2px; text-decoration:none; }
a.menu:link { color:#00f; background-color:transparent; }
a.menu:visited { color:#00f; background-color:transparent; }
a.menu:hover { color:#ff0; background-color:#00f; }
a.menu:active { color:#ff0; background-color:#a03; }
.html:
<div class="menu">
<a class="menu" href="index.htm">Home</a><br>
<a class="menu" href="extras/index.htm">Extras</a><br>
<a class="menu" href="links/index.htm">Links</a><br>
<a class="menu" href="mailto:name@domain.de">E-Mail</a><br>
</div> -
tezt schrieb:
.html:
<div class="menu">
<a class="menu" href="index.htm">Home</a><br>
<a class="menu" href="extras/index.htm">Extras</a><br>
<a class="menu" href="links/index.htm">Links</a><br>
<a class="menu" href="mailto:name@domain.de">E-Mail</a><br>
</div>
<div class="menu">
<a href="index.htm">Home</a><br>
<a href="extras/index.htm">Extras</a><br>
<a href="links/index.htm">Links</a><br>
<a" href="mailto:name@domain.de">E-Mail</a><br>
</div>
die klasse menu hasst du schon durch das div festgelegt :-)
Beitrag zuletzt geändert: 14.8.2010 20:16:50 von sideblog -
So muss es als ganze in deiner HTML Seite stehen:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title></title>
</head>
<body>
<div class="menu">
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Index</title>
<meta http-equiv="CONTENT-TYPE"
content="TEXT/HTML; CHARSET=ISO-8859-1">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="language" content="de">
<meta name="robots" content="index, follow">
<link rel="stylesheet" href="style.css" type="text/css">
<style type="text/css">
a.menu { display:block; margin-bottom:5px; text-align:center; width:16ex;
border-style:ridge; border-width:3px; padding:2px; text-decoration:none; }
a.menu:link { color:#00f; background-color:transparent; }
a.menu:visited { color:#00f; background-color:transparent; }
a.menu:hover { color:#ff0; background-color:#00f; }
a.menu:active { color:#ff0; background-color:#a03; }
</style><br>
<a class="menu" href="index.htm">Home</a><br>
<a class="menu" href="extras/index.htm">Extras</a><br>
<a class="menu" href="links/index.htm">Links</a><br>
<a class="menu" href="mailto:name@domain.de">E-Mail</a><br>
</div>
</body>
</html>
________________________________________________________________________________
M.f.g
Manager
-
mediawerk schrieb:
So muss es als ganze in deiner HTML Seite stehen:...
In der Regel sollte man die CSS auslagern, wenn sie Dokumentenübergreifend verwendet wird, da diese wärend der Sitzung im Browsercache beleibt und nicht bei jedem Seitenaufruf neu geladen werden muss.
Ebenfalls belibt dadurch die Flexibilität des Cascadings bestehen
Inline-Styles überschreiben Embeddet-Syles und diese überschreiben wieder die externe CSS. Die Reihenfolge wie die externen Styles aufgerufen werden, haben ebenfalss Einfluss auf das Überschreiben.
Im Code von mediawerk, wird die CSS unnötigerweise doppelt geladen, wobei der Ebeddet-style sofort die externen außer Kraft setzt. Doppelgemoppel und unnötig Serverlast erzeugt.
Gruß Tom
P.S.... durch die Verebung wäre die Klasse auf das DIV besser als auf jeden Menüpunkt zu setzen (wie im Posting von sideblog), wobei das öffnende DIV im Coder auch noch fehlt. Die Klasse auf UL zu setzten und das Menü im Listenstil zu erstellen wäre dann die Königsklasse ;)
Beitrag zuletzt geändert: 18.8.2010 9:56:36 von tom-moeller -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage