Sie sind nicht angemeldet.

[MODUL] Content Boxes - CSS Formatierung

skymountain

Anfänger

  • »skymountain« ist der Autor dieses Themas

Beiträge: 14

  • Nachricht senden

1

Mittwoch, 22. Mai 2013, 14:32

Content Boxes - CSS Formatierung

Hallo,

aktuell bin ich dabei das Modul Content Boxes bei mir einzufügen.

Was steht bei Euch im CSS damit es so ausschaut wie im Screencast?

Wäre über eine Antwort sehr dankbar!

Gruß

Bernd

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »skymountain« (22. Mai 2013, 14:39)

Werbung

emet

Admin & Support

  • »emet« ist männlich

Beiträge: 2 530

Wohnort: Rhein/Main

Paypal:

  • Nachricht senden

2

Mittwoch, 22. Mai 2013, 15:57

Die CSS dazu kann man nicht so einfach übernehmen, da dieses auf eine betimmte Formatierung einer Sidebar abgestimmt ist.

Es kommt ja auch darauf an, ob man Titel mit ausgeben möchte oder nicht.

In dem Beispiel wurden über die Kategorien die Boxen komplett durchformatiert, was man eigentlich nicht unbedingt benötigt - es kommt halt darauf an, was man machen möchte und auch auf das restliche Template.

Leg doch einfach mal eine Kategorie und darin mehrere Boxen an und schau dir den Quellcode der Frontendausgabe an. Nach diesen IDs und Klassen muss es dann formatiert werden.

Wenn die Überschrift nicht groß rausstechen muss, dann braucht man nur 2 Dinge zu formatieren. Und zwar das Box Out- und Inlay. Darüber kann man auch einen Rahmen machen wie im Beispiel. Für den Titel - siehe Quellcodeausgabe - und dann hinterlegen wie man möchte.

Man kann nicht einfach den CSS-Code nehmen und woanders reinsetzen. Dieses Template im Beispiel ist ganz anders aufgebaut als normal. Im Seitenelement wo die Boxen drin sitzen, das ist eigentlich ein Border mit ca. 200px. Und darauf sitzt das Seitenelement mit den Boxen.

Ausserdem ist da noch ein Schatten (Bildhintergrund) eingebunden.

Mal auf die Schnelle hier html und css Lehrgang, das geht leider nicht so einfach.

Beispielcode Quellcodeausgabe:

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<div id="cbox_set_2" class="cbox_set_rechts">

	<div id="cbox_1" class="cbox_rechts-1">

		<div class="cbox_outlay">

			<div class="cbox_inlay">

				<div class="cbox_head"><h3>Rechts 1</h3></div>

				<div class="cbox_inhalt">
				<p>Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum.</p>
				</div>

			</div>
		</div>
	</div>


Und der CSS Code kann so - über die Kategorie formatiert:

Quellcode

 
1

#sidebarright #rightcontent .cbox_set_rechts .cbox_outlay { ....


aussehen und dann die entsprechenden Formatierungen rein oder auch nur so.

Quellcode

 
1

#sidebarright .cbox_outlay { ....


Hier kannst du Border vergeben, mittig setzen, Abstände etc.

und dann mit:

Quellcode

 
1

#sidebarright .cbox_inlay { ....


den weiteren Inhalt der Boxen beeinflussen. Das würde auch schon reichen.


Über c...head den Titel übde c...inhalt den Inhalt usw.
.
HTML, was ist das? Ein neues Männermagazin? Css.., was es so alles gibt!

News: http://www.cms2day.de/news/1/
Features: http://www.cms2day.de/cms-funktionen/

Zufrieden mit cms2day und unserer Arbeit/Support - Spenden (-Button links) sind herzlich Willkommen - Dankeschön.
.
Werbung

Ähnliche Themen