WinFuture-Forum.de: CSS parent selection - WinFuture-Forum.de

Zum Inhalt wechseln

Nachrichten zum Thema: Entwicklung
Seite 1 von 1

CSS parent selection li:before wenn children a>img


#1 Mitglied ist offline   sкavєи 

  • Gruppe: aktive Mitglieder
  • Beiträge: 6.735
  • Beigetreten: 20. Juli 04
  • Reputation: 62
  • Geschlecht:Männlich
  • Wohnort:Stralsund

geschrieben 14. Dezember 2013 - 14:59

Hi,

ich benötige einen speziellen CSS-Selektor. Und zwar habe ich folgende Code-Struktur:
<ul><li><a><img /></a></li></ul>


Nun habe ich für Listen bereits ein li:before definiert:
ul > li:before {
  bla: bla;
}


Ich möchte aber, dass dies nicht angewendet wird sobald in der Liste die Kindselemente ein Link und ein Bild (also wie oben) sind. Also gewissermaßen ein:
li:before < a < img {
  display: none;
}
So funktioniert das nicht. Aber wie bekomme ich das sauber hin?

Das ganze soll am Ende eine Art Galeriestruktur haben, also so dass ich immer 3 Bilder in einer Reihe habe. Ich mus das mit Listen machen (je eine Liste pro Zeile mit 3 Bildern), da der Code aus Markdown-Syntax erzeugt wird und reines Markdown keine Tabellen kann.

Gruß
skaven

Dieser Beitrag wurde von sкavєи bearbeitet: 14. Dezember 2013 - 15:01

Eingefügtes Bild
Eingefügtes Bild
0

Anzeige



#2 Mitglied ist offline   Holger_N 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.111
  • Beigetreten: 11. September 10
  • Reputation: 458
  • Geschlecht:Männlich

geschrieben 14. Dezember 2013 - 16:32

Also das ausschließen bestimmter Klassen (in dem Fall class="ohne") funktioniert mit

li:not(.ohne):before {…}

also nur als Beispiel für das grundsätzliche Negieren. Nun weiß ich aber nicht, wie man statt der Klasse das a: als Bedingung einbaut. Ich bin mir auch nicht so sicher, ob das überhaupt geht, dass die Eltern vom Kind abhängig sind.
Bauernregel: Regnets mächtig im April, passiert irgendwas, was sich auf April reimt.
0

#3 Mitglied ist offline   sкavєи 

  • Gruppe: aktive Mitglieder
  • Beiträge: 6.735
  • Beigetreten: 20. Juli 04
  • Reputation: 62
  • Geschlecht:Männlich
  • Wohnort:Stralsund

geschrieben 14. Dezember 2013 - 16:49

Ich habe nochmal ein wenig weitergesucht. Es scheint wohl im CSS4-Draft drinzustehen. Aber ist leider noch nicht ganz endgültig. Da gibt es dann nämlich sogenannte Subject Selektoren. Aber im aktuell einsatzfähigen CSS scheint das nicht ohne weiteres Möglich zu sein. Schade. :(

Muss ich mir halt irgendwas anderes überlegen.
Eingefügtes Bild
Eingefügtes Bild
0

#4 Mitglied ist offline   Holger_N 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.111
  • Beigetreten: 11. September 10
  • Reputation: 458
  • Geschlecht:Männlich

geschrieben 14. Dezember 2013 - 16:58

Was sind denn die Listenelemente, die nicht Links UND Bilder sind? Nur Links oder nur Bilder? Also sind alle Elemente Bilder, die nur teilweise verlinkt sind oder sind es alles Links, die nur teilweise bebildert sind?

Dieser Beitrag wurde von Holger_N bearbeitet: 14. Dezember 2013 - 17:00

Bauernregel: Regnets mächtig im April, passiert irgendwas, was sich auf April reimt.
0

#5 Mitglied ist offline   sкavєи 

  • Gruppe: aktive Mitglieder
  • Beiträge: 6.735
  • Beigetreten: 20. Juli 04
  • Reputation: 62
  • Geschlecht:Männlich
  • Wohnort:Stralsund

geschrieben 14. Dezember 2013 - 20:04

Na ja, das Problem ist halt, dass ich trotzdem noch Listenelemente als normale Listen nutzen will. Aber ich muss halt irgendwie mit dem beschränkten Satz an Markdown-Kommandos eine Gallerie verwirklichen. Es muss halt nichtmal unbedingt mit Listenelementen gemacht werden. Das war in meinen Augen nur die naheliegendste Lösung, wenn ich keine Tabellen machen kann.

Falls mir nichts sinnvolles anderes einfällt kann ich auch noch versuchen das ganze System umzuschreiben und MultiMarkDown zu verwenden (wo es Tabellen gibt), aber das wollte ich eigentlich verhindern.
Eingefügtes Bild
Eingefügtes Bild
0

#6 Mitglied ist offline   Holger_N 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.111
  • Beigetreten: 11. September 10
  • Reputation: 458
  • Geschlecht:Männlich

geschrieben 14. Dezember 2013 - 20:17

Na ich dachte wenn zum Beispiel da immer Bilder drin sind aber nicht alle verlinkt sind, dann könnte man die unverlinkten mit # verlinken und dem ersten a im Listenelement dieses :before zuordnen unter der Bedingung, dass der Link auf # zeigt.

Sollte so funktionieren:

li a:first-child[href="#"]:before{…;}


Wenn es aber so ist, dass die Listenelemente alle Links enthalten aber nicht alle bebildert sind, dann funktioniert das natürlich nicht.

Dieser Beitrag wurde von Holger_N bearbeitet: 14. Dezember 2013 - 20:20

Bauernregel: Regnets mächtig im April, passiert irgendwas, was sich auf April reimt.
0

#7 Mitglied ist offline   sкavєи 

  • Gruppe: aktive Mitglieder
  • Beiträge: 6.735
  • Beigetreten: 20. Juli 04
  • Reputation: 62
  • Geschlecht:Männlich
  • Wohnort:Stralsund

geschrieben 15. Dezember 2013 - 01:22

Das Problem ist ja, dass ich durch das Markdown recht beschränkt bin und keine Klassen oder IDs vergeben kann. Und bisher verlinke ich alle Bilder. Ist wie gesagt für eine Galerieübersicht, also Thumbnails. Und der Link geht dann halt auf das Originalbild.

Aktuell habe ich eine Lösung in der ich einfach die Liste innerhalb eines blockquotes anlege. Dann kann ich den Selektor auf blockquote > ul:before setzen. So geht es.

Und im Markdown lässt sich das mit
> - Bild
>   Bild
>   Bild
> - Bild
>   Bild
>   Bild
umschreiben. Das wird dann entsprechend konvertiert.
Eingefügtes Bild
Eingefügtes Bild
0

#8 Mitglied ist offline   Holger_N 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.111
  • Beigetreten: 11. September 10
  • Reputation: 458
  • Geschlecht:Männlich

geschrieben 15. Dezember 2013 - 12:18

Achso, ich dachte es gäbe innerhalb einer einzelnen Liste unterschiedliche Listenelemente wo für ein Element das before gelten soll und für das nächste nicht.
Bauernregel: Regnets mächtig im April, passiert irgendwas, was sich auf April reimt.
0

Thema verteilen:


Seite 1 von 1

1 Besucher lesen dieses Thema
Mitglieder: 0, Gäste: 1, unsichtbare Mitglieder: 0