[ERLEDIGT] Bereiche in DIV's mehrfach bearbeiten?

[kristalljunge]

Hallo nochmal,

Auf einer Seite habe ich mit PHP-Include mehrere "kleinere Bereiche" eingebunden. Diese Bereiche sind mit mehreren Elementen versehen. Um es leichter zu erklären habe ich die Bereiche mal mit "Text-Feld1" und "Text-Feld2" auf dem Bild verdeutlicht. Beide Text-Felder sind von einer externen .php mit PHP-Include auf die Index-Seite eingebunden.

Der PHP-Include in gelb ist in DIV1, alle weiteren in DIV2 ummantelt. Wenn jetzt neuer Inhalt dazukommt, soll aus dem gelben ein blauer werden. Dann soll Textfeld1 und zwei eine andere CSS-Bearbeitung bekommen.

Ist es möglich, dass ich z.B. dem Textfeld 1 eine ID, Klasse oder was auch immergebe, die sich an den überliegen DIV-Einfluss orientiert? Sprich, dass wenn er "der gelbe Bereich" ist, die und die CSS-Befehle annimmt, und sobald er ein "blaues" wird, automatisch eine Andere wird, oder muss ich immer zwei externe .php's schreiben, um das zu ermöglichen?

Sofern ich mein Problem nicht richtig erklärt habe, versuche ich es via Code nochmal zu verdeutlichen.

Und zwar habe ich auf index.php in etwa folgenden Code:

<div class="news1" style="background-image: url(/beispielbild.jpg);">
<?php include('news/testnews1/topic.php'); ?></div>

<div class="news2" style="background-image: url(/beispielbild2.png);">
<?php include('news/testnews2/topic.php'); ?></div>

usw. auf einer .php Seite.

/news/testnews1/topic.php sieht dann in etwa so aus:

<span>Textfeld 1</span>
<span>Textfeld 2</span>


Wenn ich im css .news1 angehe, kann ich grundsätzliche Sachen wie Farbe, Schriftart etc. bearbeiten, wenn aber .news1 zwei verschiedene Schriftarten etc. sind - wie mache ich es dann?

 

[MrMurphy]

Hallo

Meist wird für solche Probleme ein leeres Layout erstellt und dann werden die Inhalte aus einer Datenbank per PHP in die entsprechenden Container eingefügt. Bei den Inhalten haben id und class nichts verloren.

Mit CSS3 wurden zudem die Möglichkeiten der Selektoren stark erweitert. Damit sind bei einem strukturiertem Quelltext viel weniger id und class erforderlich.

Auch die neuen Elemente wie article und section erleichtern das Erstellen einer Vorlage für wechselnde Inhalte.

Für dein Problem solltest du also

HTML5 und seine neuen Elemente lernen
CSS3-Selektoren lernen
PHP lernen
Die Verwendung von Datenbanken lernen

Oder gleich ein Content Management System (CMS) verwenden.

Gruss

MrMurphy

 

[SpiceLab]

Die Frage ist, soweit ich sie richtig verstanden habe, nicht mit der Formatierungssprache CSS zu lösen, und wird zunächst nach PHP verschoben.

Man kann im voraus CSS-Selektoren definieren, die für neue / nachträglich inkludierte Inhalte gelten sollen, aber den dynamischen Prozeß, wie du ihn beschrieben hast, kann CSS nicht leisten.

wenn aber .news1 zwei verschiedene Schriftarten etc. sind - wie mache ich es dann?

Beispielsweise für jede der Schriftarten eine eigene Klasse anlegen, und die jeweilige im class-Attribut ergänzen/setzen.

Falls sie aber gleichzeitig / parallel innerhalb von .news1 enthalten sind, über Nachfahrenselektoren - z.B. per Klassen:

.news1 .fontFamily1 {...]
.news1 .fontFamily2 {...]

Die beiden fontFamily-Klassen sind dann den entsprechenden Elementen zuzuordnen.

 

[kristalljunge]

Jaa, dass ich für die Zukunft mich in CMS & Co reinarbeiten muss, ist mir bewusst.

Da ich es aber über CSS möglich war mit einer Klasse mein "Problem" zu beseitigen, hatte ich mich gefragt, ob ich das mit einer zweiten Klasse auch tun kann. Ich hab diverses probiert: news1.fontFamily1, fontFamily1.news1 usw. aber .news1 . fontFamily1 hatte ich nicht versucht - und es klappt super! Vieeeelen Dank! <3

 

[SpiceLab]

Ich hab diverses probiert: news1.fontFamily1, fontFamily1.news1 usw. aber .news1 . fontFamily1 hatte ich nicht versucht - und es klappt super! Vieeeelen Dank! <3

Ein Selektor mit zwei Klassen ohne Leerzeichen:

.news1.fontFamily1 {...}

würde hierfür gelten:

<div class="news1 fontFamily1">

https://wiki.selfhtml.org/wiki/CSS/Selektoren/Klassenselektor