CSS als externe Datei

	CSS als externe Datei
	html knowhow

CSS als externe Datei
Diese Seite sieht eigentlich ganz normal aus. Das besondere ist aber, dass das CSS in eine komplett andere Datei ausgelagert wurde. Das hat nun den Vorteil, daß man diese "Vorlage" mit dem Befehl <link rel="stylesheet" href="beispiel.css"/> im Head für alle anderen Seiten benutzen kann.
So sieht der CSS-Quellcode aus
body {background-color: powderblue;width:100%; font-family:Cambria, Cochin, Georgia, Times, "Times New Roman", serif; font-size:0.8em;} p {color: black;margin-top: 3px;margin-bottom: 3px;text-align: left;font-weight: normal;font-size: 1.3em;} h1 {color: yellow;} h2 {color: white;text-align:left;background-color:teal;margin-left:20px;height:auto;valign:middle;} h3 {color: black;font-size:1.3em;background-color:white;margin-left:20px;font-weight: normal;} h4 {color: white;font-size:1.3em;background-color:teal;padding-left:20px;padding-right:20px;font-weight: bold;} tr {color: black;text-align:left;background-color:transparent;padding: 0px; border: 0px solid;border-width:0.5em;border-color:white;font-size:1.3em;} a {color: purple;text-decoration:none} span {color: gray;} td {color: black;text-align:left;background-color:white;margin-left:20px;border-style: solid; padding: 0px; border: 1px solid white;font-size:1.0em;height:auto} th {color: black;text-align:left; valign:middle; background-color:teal;border-style: solid; padding: 0px; border: 0px solid lime;font-size:1.0em;height:auto} table {border:1em;border-color:lime;width:95%;border-spacing: 0px; border-collapse: separate;cellspacing:0; cellpadding:0} div {color: transparent;height:40px;border: 0px solid black;} img {display: block; margin: 0 auto;width:30%;height:auto;float:left;} .table {border:0em;width:90%;background-color:transparent;text-align:center;} .td {color: black;text-align:left;background-color:transparent;font-size:1.0em;border:0px;height:10px} .h1 {color: purple;font-size:1.5em;valign:bottom;} .h2 {color: #008080;font-size:1.6em;background-color:transparent;font-family: "Sigmar One"; } .div {left: 2%;top: 2em;position:absolute;height: 2em;width: 5.6em} #img {height:10px} .img2 {width:40px;height:auto} .wrapper {width:100%;float: right;height: 200px;} .fixed-bg {background-attachment: fixed;background-repeat: no-repeat;background-size: cover;background-position: right right;height: 300%; width: 100%;display: table;} .fixed-bg h1 {display: table-cell;vertical-align: middle;} .scroll-bg {background-color: white;padding: 10px 10px;color: black;font-size:0.8em;} /* first section /.bg-1 {background-image: url('../bilder/monroeoben.jpg');} / third section */.bg-2 {background-image: url('../bilder/monroeunten.jpg');} #parallax-background {background-image: url("../Bilder/plakat2.jpg"); width: 100%; background-color:#D2FFEA; height: auto; background-size: 100%; background-attachment: fixed; background-repeat: no-repeat; text-align:center;} div#hintergrundbild {background-image: url(../Bilder/verlauf.jpg);background-size: 100%;} th {height:auto;} #img30 {width:100%;} .container {position: relative;width: 100%;left: 0%;} footer {background-color:teal;font-size:1.3em;text-align:center}
Und so sieht´s aus, das Styling mit CSS

Htmlknowhow möchte Ihnen keine Lehrstunde in html, css oder Java geben, sondern ganz praktische Tipps, wie Sie ihre Homepage optisch und inhaltlich verbessern können.

Html, CSS und Java bieten da super Möglichkeiten der Webseiten-Gestaltung. Bevor Sie aber mit Ihrem Homepage-Projekt beginnen, sollten Sie sich über Grundsätzliches informieren, damit Sie wissen, was alles auf Sie zukommt. Ich gebe Homepage-Designern Tipps, wie sie ihren Webauftritt verbessern können.

Viele, die eine Webseite betreiben wollen, greifen auf vorgefertigt Seiten zurück. Die gibt es z.B. bei Ionos, Jamdo, Strato und vielen, vielen mehr. Aber wer etwas Individuelles haben möchte, der macht alles selber. Es lohnt sich garantiert. Ein Styling, das keinem anderen gleicht.

Ich möchte Ihnen keine Lehrstunde in html, css oder Java geben, sondern ganz praktische Tipps, wie Sie ihre Homepage optisch und inhaltlich verbessern können, bieten.