[GastForen Web allgemein HTML und CSS / Stylesheets ePub + CSS: Hängender Einzug?

  • Suche
  • Hilfe
  • Lesezeichen
  • Benutzerliste
Themen
Beiträge
Moderatoren
Letzter Beitrag

ePub + CSS: Hängender Einzug?

Sacha Heck
Beiträge gesamt: 3281

18. Nov 2010, 14:19
Beitrag # 1 von 11
Bewertung:
(13443 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo,

Ich bin gerade dabei, ein CSS für eine ePub-Datei zu »tweaken« ;)
Dabei stolpere ich gerade über folgendes: Ich habe in meinem HTML,
das aus InDesign exportiert wurde, nun diese Zeile:

Code
<p class="rede">Va-t-il y avoir quelqu’un dans ma classe que je connais ? Qui sera mon régent de classe et sera-t-il gentil ? …</p> 


Ich möchte nun, dass alles, was mit der CSS-Klasse »rede« ausgezeichnet
ist, mit hängendem Einzug versehen wird, mit einem Gedankenstrich vorne
dran. So wie ich das sehe, ließe sich das mit einem <ul><li> lösen,
nur muß ich dann diese Tags ins HTML rein bekommen, da InDesign
hier leider nichts vorsieht (Suchen Ersetzen?). Bei <ul><li> ließe sich dann
der Punkt der normalerweise gesetzt wird, durch ein eigenes Zeichen (eben
Gedankenstrich) ersetzen ...

Siehe auch Attachment für ein Beispiel wie es aussehen soll.

Danke für Ideen.

Gruß,
Sacha

(Dieser Beitrag wurde von Sacha Heck am 18. Nov 2010, 14:20 geändert)

Anhang:
Hanging_indent.png (19.2 KB)
X

ePub + CSS: Hängender Einzug?

SabineP
Beiträge gesamt: 7586

18. Nov 2010, 14:41
Beitrag # 2 von 11
Beitrag ID: #457378
Bewertung:
(13433 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Sacha,

dafür gibt´s die CSS-Eigenschaften

list-style-type
http://de.selfhtml.org/...nschaften/listen.htm

und list-style-image
http://de.selfhtml.org/...htm#list_style_image

Für Deinem Fall brauchst Du
list-style-image


als Antwort auf: [#457371]
(Dieser Beitrag wurde von SabineP am 18. Nov 2010, 14:43 geändert)

ePub + CSS: Hängender Einzug?

Sacha Heck
Beiträge gesamt: 3281

18. Nov 2010, 14:55
Beitrag # 3 von 11
Beitrag ID: #457382
Bewertung:
(13421 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Sabine,

Ja, das mit list-style-type und list-style-image hab ich gefunden. Mein Problem
ist aber eher, die <ul> und <li> Tags ins Dokument zu bekommen.
D.h. kann ich nicht was definieren wie: Alles was mit CSS-Klasse »rede«
ausgezeichnet ist, soll eine Liste sein ...? Also die Liste komplett via
CSS erstellen?

Gruß,
Sacha


als Antwort auf: [#457378]

ePub + CSS: Hängender Einzug?

FSt
  
Beiträge gesamt: 1965

18. Nov 2010, 14:59
Beitrag # 4 von 11
Beitrag ID: #457385
Bewertung:
(13420 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Sacha

Code
.rede {  
padding-left: 30px;
background: transparent url('http://www.deinewebsite.lu/zeichen-vor-dem-text.gif') no-repeat 15px 5px;
}


Das wäre eine Lösung ohne die von Dir verlangte Umstellung auf Listen.

Gruss
Martin


als Antwort auf: [#457371]

ePub + CSS: Hängender Einzug?

Sacha Heck
Beiträge gesamt: 3281

18. Nov 2010, 15:27
Beitrag # 5 von 11
Beitrag ID: #457395
Bewertung:
(13396 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Martin,

Danke für den Tipp. Muß bei dieser Lösung mit einem Bild verfahren werden
oder kann ich auch ein Zeichen gebrauchen? Ich möchte in meinem Fall
ja den Gedankenstrich davor? Das wäre ja dann: &#8211;

Ich hab z.B. diesen Code gefunden um die Bullets zu ersetzen. Hier geht
man aber wieder von einem Listenelement aus (das ich ja nicht habe)

Code
#custom-gen ul li:before { 
content: "\00BB \0020";
}

Doch wie kann ich den jetzt da kombinieren? Oder geht das nicht?

Gruß,
Sacha


als Antwort auf: [#457385]

ePub + CSS: Hängender Einzug?

FSt
  
Beiträge gesamt: 1965

18. Nov 2010, 15:43
Beitrag # 6 von 11
Beitrag ID: #457403
Bewertung:
(13390 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Sacha

Ohne es jetzt ausprobiert zu haben, würde ich aber meinen, dass Deine Variante keine hängenden Einzüge produziert, sondern einfach einen Gedankenstrich vor den Text stellt, und diesen dann bei einem padding ebenfalls einrückt.

Gruss
Martin


als Antwort auf: [#457395]

ePub + CSS: Hängender Einzug?

SabineP
Beiträge gesamt: 7586

18. Nov 2010, 17:00
Beitrag # 7 von 11
Beitrag ID: #457419
Bewertung:
(13370 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
So müßte es klappen:
.rede{text-indent:-1em;margin-left:1em}

http://aktuell.de.selfhtml.org/...tung.htm#text_indent


als Antwort auf: [#457382]

ePub + CSS: Hängender Einzug?

FSt
  
Beiträge gesamt: 1965

18. Nov 2010, 17:17
Beitrag # 8 von 11
Beitrag ID: #457424
Bewertung:
(13364 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Sabine

text-indent lässt leider nur die erste Zeile einrücken.

Gruss
Martin


als Antwort auf: [#457419]

ePub + CSS: Hängender Einzug?

Sacha Heck
Beiträge gesamt: 3281

18. Nov 2010, 17:18
Beitrag # 9 von 11
Beitrag ID: #457425
Bewertung:
(13364 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Sabine,

Yep, das funktioniert :-) Ich hab's ein wenig verändert. Da der Gedankenstrich
schon im HTML drin ist, funktioniert das so. Im Anhang ein Screenshot
aus Digital Editions. Mein CSS-Code sieht jetzt so aus:

Code
p.rede { 
font-family: "serif";
line-height: 1.21em;
font-size: 1.00em;
margin-bottom: 1.18em;
margin-top: 0.00em;
margin-right: 2.36em;
text-align: left;
font-weight: normal;
font-style: normal;
color: rgb(0,0,0);
text-indent: -0.8em;
margin-left: 3.36em
}

Danke!

Gruß,
Sacha


als Antwort auf: [#457419]
Anhang:
Picture 1.png (119 KB)

ePub + CSS: Hängender Einzug?

SabineP
Beiträge gesamt: 7586

18. Nov 2010, 17:52
Beitrag # 10 von 11
Beitrag ID: #457431
Bewertung:
(13354 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
>> text-indent lässt leider nur die erste Zeile einrücken.
Hallo Martin,
schau Dir mal das dritte Beispiel an (dritter Absatz), ausrücken geht auch:
http://aktuell.de.selfhtml.org/...eige/text_indent.htm
Das dritte Beispiel hat mich erst auf diese Idee gebracht.


als Antwort auf: [#457424]
(Dieser Beitrag wurde von SabineP am 18. Nov 2010, 17:55 geändert)

ePub + CSS: Hängender Einzug?

FSt
  
Beiträge gesamt: 1965

18. Nov 2010, 23:29
Beitrag # 11 von 11
Beitrag ID: #457456
Bewertung:
(13316 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Ich lehrs wohl nie. Man soll Sabine nicht korrigieren wollen Wink


als Antwort auf: [#457431]
X

Veranstaltungskalender

Hier können Sie Ihre Anlässe eintragen, welche einen Zusammenhang mit den Angeboten von HilfDirSelbst.ch wie z.B. Adobe InDesign, Photoshop, Illustrator, PDF, Pitstop, Affinity, Marketing, SEO, Büro- und Rechtsthemen etc. haben. Die Einträge werden moderiert freigeschaltet. Dies wird werktags üblicherweise innert 24 Stunden erfolgen.

pdf-icon Hier eine kleine Anleitung hinsichtlich Bedeutung der auszufüllenden Formularfelder.

Veranstaltungen
14.05.2024

Online
Dienstag, 14. Mai 2024, 10.00 - 10.30 Uhr

Webinar

Prozessoptimierung ist ein Teamsport! Keine Software und keine Maschine allein kann Ihnen helfen, die Effizienzpotenziale Ihres Betriebes maximal auszuschöpfen. Von der Auftragsannahme über die Vorstufe und den Druck bis hin zur Weiterverarbeitung – alles muss optimal ineinandergreifen. Apropos Weiterverarbeitung – in vielen Druckbetrieben fristet sie in Sachen Prozessoptimierung immer noch ein Schattendasein. Dabei liegen hier mittlerweile die größten Einsparpotenziale! In einem Webinar von Horizon und Impressed erfahren Sie, wie Sie diese Einsparungen realisieren können. Horizon, bekannt für innovative Lösungen in der Druckweiterverarbeitung, bietet mit iCE LiNK eine Workflowlösung für die Weiterverarbeitung. iCE LiNK überwacht, visualisiert und analysiert Produktionsabläufe und unterstützt bei der Wartung – damit immer alles reibungslos läuft. Den gleichen Anspruch hat der von Impressed entwickelte Impressed Workflow Server – er ist die smarte PDF-Workflow-Lösung für Druckereien, die Datenmanagement, Preflight und Produktionssteuerung übernimmt. Im Webinar zeigen Ihnen die Experten von Horizon und Impressed, wie beide Lösungen im Team die Effizienz und Produktivität Ihres Betriebes steigern können. Melden Sie sich am besten gleich an, wir freuen uns auf Sie! PS: Melden Sie sich in jedem Fall an – sollten Sie zum Termin verhindert sein, erhalten Sie die Aufzeichnung.

kostenlos

Ja

Organisator: Impressed / Horizon

https://www.impressed.de/schulung.php?c=sDetail&sid=327

Einsparpotenziale in der Weiterverarbeitung
Veranstaltungen
16.05.2024

Online
Donnerstag, 16. Mai 2024, 10.00 - 10.30 Uhr

Webinar

Komplizierte, kleinteilige Aufträge; alles sehr speziell; seit Jahren bewährte Prozesse – da können wir nichts standardisieren und automatisieren! Das sagen viele Großformatdrucker – aber stimmt das wirklich, ist dem tatsächlich so? Günther Business Solutions und Impressed treten in einem Webinar den Gegenbeweis an. Experten beider Unternehmen zeigen, wie Großformatdrucker vom Einsatz zweier bewährter Lösungen profitieren können: • von advanter print+sign von Günther Business Solutions, dem ERP-System für den Großformatdruck, dass alle Phasen der Wertschöpfung im Large Format Printing abdeckt • von Impressed Workflow Server, der smarten PDF-Workflow-Lösung für Druckereien, die Datenmanagement, Preflight und Produktionssteuerung übernimmt Über die Kombination beider Lösungen können Großformatdrucker ihre Prozesse mit modernen Workflows Schritt für Schritt automatisieren – und so zügig deutliche Zeit- und Kosteneinsparungen realisieren. Das Webinar sollten Sie sich nicht entgehen lassen – damit Sie keine Effizienzpotenziale mehr liegen lassen. Melden Sie sich am besten gleich an, wir freuen uns auf Sie! PS: Melden Sie sich in jedem Fall an – sollten Sie zum Termin verhindert sein, erhalten Sie die Aufzeichnung.

kostenlos

Nein

Organisator: Impressed / Günther Business Solutions

https://www.impressed.de/schulung.php?c=sDetail&sid=326

Und es geht doch: Automatisierung im Großformatdruck!