Difference between revisions of "CSS"
(→CSS im Header) |
|||
| Line 12: | Line 12: | ||
text-decoration:none; | text-decoration:none; | ||
color:rgb(0,0,0); | color:rgb(0,0,0); | ||
| + | } | ||
| + | a:hover { | ||
| + | color: #fff; | ||
} | } | ||
</style> | </style> | ||
Revision as of 20:54, 17 November 2011
Contents
CSS im HTML
CSS im Header
<syntaxhighlight lang="html4strict"> <html>
<header>
<style>
a {
text-decoration:none;
color:rgb(0,0,0);
}
a:hover {
color: #fff;
} </style> </header>
<body> </body>
</html> </syntaxhighlight>
CSS-Datei verlinken
Mit dieser Zeile bindet man eine CSS-Datei ein:
<syntaxhighlight lang="html4strict">
<link rel="stylesheet" type="text/css" href="MeinName.css" media="all"/>
</syntaxhighlight>
- Diese Zeile wird in den Head gelegt. (Zwischen <head> und </head>)
- Die Datei "MeinName.css" ist eine normale Text Datei in UTF-8 Kodierung der man die Endung ".css" gibt.
- Der Dateiname muss selbstverständlich mit dem im Link genau übereinstimmen (auch in Groß- und Kleinschreibung).
Typische Webseite
Typischer Aufbau einer Webseite mit Header, Footer, Menü und Content in der Mitte. Das Ganze ist in einen "wrapper" und "inner-wrapper" gepackt.
<syntaxhighlight lang="html4strict"> <html> <head> <title>demo</title> <link rel="stylesheet" type="text/css" href="style.css" media="all"> </head> <body>
<a href="./demo.hmtl">title</a>
<a href="#titel1">projekt1</a>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
<a href="#titel1">projekt1</a>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</body> </html> </syntaxhighlight>
