Mittwoch, 14. November 2012

Blockquotes stylen

Heute will ich euch zeigen wie man Blockquotes stylen kann, wenn ihr nicht wisst was das ist, siehe unten.
So sieht es z.B bei mir aus
Blockquotes---Blockquotes---Blockquotes
Diesen Code müsst ihr bei Vorlage--->HTML bearbeiten, in CSS Bereich reinkopieren. Wo ist eigentlich egal, muss aber in der CSS Bereich sein.

So sieht der CSS Bereich aus. Ich habe nur irgendein Abschnitt genommen.






/*Blockquotes
----------------------------------------------- */
blockquote {
font: 12px normal
margin-top: 10px;
margin-bottom: 10px;
margin-left: 20px;
margin-right: 20px;
padding-left: 15px;
padding-right: 15px;
border-left: 1px solid #CCE7FF;
border-top: 1px solid #CCE7FF;
border-bottom: 1px solid #CCE7FF;
border-right: 1px solid #CCE7FF;
background-color: #FFF5FE;
}


font: 12px normal | 12px ist die Grösse, normal stellt die Schrift normal dar, ersetze es durch oblique, wenn du es kursiv willst. Ihr könnt auch die Schrift Einstellung bei jedem Post ändern, einfach Text makieren und einstellen und z.b unterstrichen. Farbe kann man auch so ändern.

margin-top/bottom/left/right: 20px; | Steht für den Abstand von Rand der Blockquote zur Rand des posts, die Zahl vor px könnt ihr beliebig ändern.


padding-left/right: 15px; | Der Abstand von Text innerhalb des Quotes zur Rand


border-left/top/bottom/right: 1px solid #CCE7FF; | Entscheidet über die Farbe und die Dicke des Rahmens. Lässt ihr ein Element aus gibt es auf dieser Seite einfach keinen Rahmen.
background-color: #FFF5FE; | Entscheidet über die Hintergrund Farben, ich habe einfach weiss genommen. Alle #xxxxxx sind Farbcodes und können geändert werden. Farben findet ihr bei ColorPicker

Ich hoffe dieses Tutorial war ausführlich genug.

Keine Kommentare:

Kommentar veröffentlichen