Das Design Ihrer Website: CSS Hintergründe

Das Design einer Website ist auch (wenn nicht mehr) wichtiger als die Funktionalität und Benutzerfreundlichkeit. Es ist für eine erfolgreiche Website von grundlegender Bedeutung für stark visuell als auch fundamental.

Lassen Sie uns einen kurzen Moment, um über die Sixtinische Kapelle, um meinen Standpunkt zu verdeutlichen. Die Kapelle selbst wurde gebaut und ist fundamental letzten Ton. Allerdings, die Kapelle ist nicht nur berühmt wegen ihrer Funktionalität. Michelangelos berühmte Gemälde liegt an der Decke der Kapelle und überlässt in Ehrfurcht vor der künstlerischen Schönheit. Das Ergebnis dieser Kombination ist ganz einfach einer der größten Kapellen der Welt.

Webseiten existieren kann entweder unter Berufung auf das Vorhandensein von großen Entwurf oder phantastische Code, sondern um für Websites zu gedeihen ist es wichtig, die beiden zu verbinden.

In diesem Beitrag möchte ich einen Blick auf die wichtige Rolle des Design und Codierung der Gleichung mit CSS nehmen, mehr geben die CSS-Eigenschaft background.

W3Schools definiert die CSS-Eigenschaft als Hintergrund: "eine zusammenfassende Eigenschaft zur Einstellung aller Hintergrund-Eigenschaften in einer Erklärung an." Beachten Sie, dass die meisten Werte im Background-Eigenschaft kann als ihr Eigentum verwendet werden gefunden. Die folgenden Beispiele sind nur mit der Kurzform der Background-Eigenschaft. Ein Nachteil der Anwendung von nur Kurzform ist, dass es nicht gut für Debugging oder Entdeckung Schreibfehler

Lassen Sie uns, indem Sie auf den Grundwert, dass ein erstes sollte auf jeder Eigenschaft background: Farbe beginnen.

body {
background: #000000;
}

Mit einfachen Farbwert kann ein Hintergrund sehr schlicht und einfach. Diese Einfachheit kann für viele Websites von Vorteil. Beachten Sie, dass ausgezeichnete Design-Technik bedeutet nicht zwangsläufig, grellen Bildern und Web überall 2,0 Fasen. Neben den Farben in der Hintergrund-Eigenschaft verwendet, können Sie auch den Wert transparent. Die transparente Wert ist hauptsächlich auf Hintergründe innerhalb der Website, z. B. in divs und Tabellen und nicht allgemein auf eine Stelle als Hintergrund verwendet finden Sie hier.

Der Farbwert sollte immer ein Ankerpunkt in Ihrer Eigenschaft background. Auch wenn Sie ein Bild im Hintergrund, das die Bereiche 1000 + Pixel, bist du immer noch zu wollen, einen Farbwert hinter sich gelegt, so dass während Ihr Hintergrundbild wird beim Laden der Benutzer nicht sehen einen starken weißen Hintergrund auf Ihrem schönen dunklen Website.

Weiter diskutieren können weitere wichtige Hintergrund-Wert, besonders in der heutigen Web-Welt, die Hintergrund-Bild.

body {
background: #000000 url(images/yourimage.jpg) repeat fixed top;
}

Bilder können in einer Vielzahl von verschiedenen Arten verwendet werden, und in Verbindung mit Werten wie background-attachment, background-position und background-repeat. Es gibt kein Ende, was Sie tun können, um Ihren Körper Hintergrund. Zwar können Sie ein Bild in Ihrem CSS ohne das Hinzufügen dieser anderen Werten ist es wichtig, dass die vier Werte, zusammen zu bleiben.

Die Beispiele oben und unten zeigen nur einige Möglichkeiten, wie Sie den Hintergrund-Bild-Wert mit Hilfe der background-repeat-Wert verwenden. Einfache gemustertem Hintergrund mit dem Hintergrund-repeat Wert zu wiederholen, sind oben dargestellt. Kompliziertere Versionen der Wert gesetzt werden, um repeat-x kann unten gesehen werden. Centered Bilder kann durch das Setzen Sie den Wert auf no-repeat wie die schöne dunkle Website erreicht werden, die background-repeat und background-image durch die background-position und background-attachment Werte Beihilfe Hervorhebung Ihrer Websites Stil unterstützt.