CSS3 Formatierungen

Mit Hilfe von CSS3-Formatierungen lassen sich ohne großen Aufwand viele Effekt auf Deiner Webseite realisieren! Ein paar Beispiele findet Ihr hier:

 

CSS3-Boxen

Beispiel: Box mit abgerundeten Ecken und Schatten

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut erat, sed diam voluptua.

 

CSS Style-Anweisung:

 

<style type="text/css">

/* CSS3 Rounded Corners Box mit Schatten */

.css3box {

border: 1px solid #ccc;

-webkit-border-radius: 10px;

-moz-border-radius: 10px;

border-radius: 10px;

-webkit-box-shadow: 3px 3px 11px #ccc;

-moz-box-shadow: 3px 3px 6px #ccc;

box-shadow: 3px 3px 6px #ccc;

padding:5px;

}

</style>

Um die Style-Anweisung auf ein Jimdo-Element anzuwenden, muss dieses zunächst mit der in der Anweisung festgelegten Klasse ausgestattet werden. Das kann man entweder mit einem JavaScript erreichen, das die Klasse einem vorhandenem Element zuweist, oder (bei Jimdo-Textelementen) ganz einfach mit Bordmitteln:

  • Textelement anlegen und mit Text füllen
  • öffnen html-Modus (</>)
  • vor den html-Code folgendes html-snippet einsetzen: <div class="css3box">
  • mit "Ok" bestätigen
  • Textelement speichern

Beispiel:

Jimdo Snippets

 

Wir haben vor, eine Extra-Seite mit kleinen, hilfreichen CSS-Anpassungen zum Download für verschiedene Themen anzulegen. Bitte schreibt uns eine Nachricht über unser Kontaktformular, wenn Ihr dazu Ideen oder Vorschläge habt!

 

LG, az

Kommentar schreiben

Kommentare: 0