So richten Sie die Bildunterschrift unter dem Bild ein

8

Ich habe 9 Bilder insgesamt und drei in jeder Zeile, ich habe es geschafft, eine Bildunterschrift für eines meiner Bilder hinzuzufügen, aber nicht für die anderen, weil es nur alles darunter und nicht ausgerichteten Text auf Zeilen pro zentriert Bild.

%Vor%

Und so weiter.

    
Brian Lam 02.10.2013, 13:59
quelle

3 Antworten

24

Ich würde den Code auf diese Weise einrichten:

%Vor%

und wenden Sie das folgende CSS an:

%Vor%

Da jedes figure ein Inline-Block ist, können Sie die Einheit grundsätzlich dreimal pro Zeile wiederholen, indem Sie nach jedem dritten ein <br> hinzufügen oder in einem Blockelement drei oder ein CSS3 nth-of-type(3n) selector um einen Zeilenumbruch oder ähnliches hinzuzufügen.

Verwenden Sie text-align: center auf figcaption , um den Test an der Mitte auszurichten.

Siehe Demo unter: Ссылка

Die Ergebnisse sehen so aus (für einen Bildschirm mit ausreichend großem Bildschirm):

    
Marc Audet 02.10.2013, 14:13
quelle
1

Jede Figur sollte nur ein Bild und eine Figur enthalten.

%Vor%

BTW ... das Element 'center' existiert nicht mehr.

Codepen-Beispiel

    
Paulie_D 02.10.2013 14:05
quelle
0

das funktioniert für mich.

%Vor%
  

Textausrichtung: Mitte; ist das einzige, was gebraucht wird.

    
anatak 21.03.2018 03:05
quelle

Tags und Links

Django: Verwenden von Annotate, Count und Distinct in einem Queryset Django-Weasyprint Bildproblem