Benutzer-Werkzeuge

Webseiten-Werkzeuge


cms:css

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Nächste Überarbeitung
Vorhergehende Überarbeitung
cms:css [2015/09/03 20:06]
127.0.0.1 Externe Bearbeitung
cms:css [2025/08/12 14:10] (aktuell)
walter [Methode 2:]
Zeile 1: Zeile 1:
 ====== Cascading Stylesheets (CSS) ====== ====== Cascading Stylesheets (CSS) ======
  
-Zwei gute CSS-Programme ​sind: +===== Simple.css ===== 
-  ​*Simple CSS und  +Die Website simple.css lässt sich in vorhandenen HTML-Code einbinden, sodass anschließend ​CSS-Befehle leichter zu finden und zu integrieren ​sind: https://​simplecss.org/​. 
-  ​*CSSedit.+ 
 +===== NVU und KompoZer =====
  
 Besser finde ich allerdings HTML-Programme mit eingebauten CSS-Editoren. Die einzigen Programme dieser Art, die ich kenne und die intuitiv zu bedienen sind, sind Besser finde ich allerdings HTML-Programme mit eingebauten CSS-Editoren. Die einzigen Programme dieser Art, die ich kenne und die intuitiv zu bedienen sind, sind
   *NvU (http://​www.nvu.com/​) und    *NvU (http://​www.nvu.com/​) und 
-  *KompoZer (http://www.kompozer.net/)+  *KompoZer ([[https://sourceforge.net/projects/​kompozer/​]]) 
 + 
 +Voraussetzung dafür, dass man CSS-Einstellungen und ihre Wirkungen in diesen Programmen sehen kann, ist natürlich, dass eine HTML-Datei damit geöffnet wurde (oder dass HTML-Code manuell eingegeben wurde). 
 + 
 +Einfach Menü <Ansicht - HTML-Tags>​ wählen, dann werden alle Tags als gelbe Symbole dargestellt. Nun zwei Möglichkeiten:​ 
 +==== Methode 1: ==== 
 +Mit rechter Maustaste auf einen Tag klicken und "​Erweiterte Eigenschaften"​ wählen. Im aufgehenden Fenster entweder HTML-Attribute oder "​Inline Style (CSS)" wählen. Hier kann der Code direkt bearbeitet werden.  
 +{{:​ebook:​erweiterte_einstellungen_kompozer.png?​400|}} 
 +==== Methode 2: ==== 
 +In der Statuszeile (falls nötig per Menü <Ansicht - Statuszeile>​ zum Vorschein holen) am unteren Rand des Bildschirms mit rechter Maustaste auf das gewünschte Element klicken und "​Inline Styles"​ wählen. Nun geht ein Fenster mit mehreren Reitern auf, in dem alle denkbaren Eigenschaften eingestellt werden können. Das Gute an diesem Fenster: Die Auswirkung einer Einstellung wird sofort in einem kleinen Vorschaufenster angezeigt:​ 
 + 
 +{{:​ebook:​inline_styles_in_kompozer.png?​400|}} 
 + 
 +==== Code-Übernahme in andere Datei ====
  
 +Soll Code in eine andere Datei (zum Beispiel in eine style-css-Datei in Sigil) übernommen werden, ist es am besten, die Einstellungen mit Methode 2 vorzunehmen und mit Methode 1 anzuschauen und zu kopieren und dann in die andere Datei einzufügen.
 +   
 ===== CSS für EPUB: ===== ===== CSS für EPUB: =====
  
 http://​www.data2type.de/​xml-xslt-xslfo/​epub-ueberblick/​ http://​www.data2type.de/​xml-xslt-xslfo/​epub-ueberblick/​
cms/css.1441303563.txt.gz · Zuletzt geändert: 2015/09/03 20:06 von 127.0.0.1