Unterschiede
Hier werden die Unterschiede zwischen der gewählten und der aktuellen Version gezeigt.
javafx:css 2015/04/14 09:44 | javafx:css 2020/01/22 20:59 aktuell | ||
---|---|---|---|
Zeile 29: | Zeile 29: | ||
Pane pane1 = new Pane(); | Pane pane1 = new Pane(); | ||
- | pane1.setId("myID"); | + | pane1.setId("myId"); |
Pane pane2 = new Pane(); | Pane pane2 = new Pane(); | ||
Zeile 37: | Zeile 37: | ||
Die dazugehörige my.css -Datei:\\ | Die dazugehörige my.css -Datei:\\ | ||
<code css> | <code css> | ||
- | #myID { | + | #myId { |
-fx-... | -fx-... | ||
} | } | ||
Zeile 53: | Zeile 53: | ||
-fx-max-height: 20px; // Maximale Höhe 20px | -fx-max-height: 20px; // Maximale Höhe 20px | ||
-fx-padding: 0 10 0 10; // Abstand zwischen Text und Rand (open, rechts, unten, links) | -fx-padding: 0 10 0 10; // Abstand zwischen Text und Rand (open, rechts, unten, links) | ||
+ | } | ||
+ | |||
+ | .column-header { | ||
+ | -fx-background-color: red; // Roter Tabellen-Header-Hintergrund | ||
+ | } | ||
+ | |||
+ | .column-header .label { | ||
+ | -fx-alignment: CENTER_LEFT; // Linksbündige Ausrichtung der Spaltenüberschrift | ||
+ | } | ||
+ | |||
+ | .combo-box-base { | ||
+ | -fx-background-color: gray; // Grauer Hintergrund für Pfeilrechteck und Rahmen | ||
+ | } | ||
+ | |||
+ | .combo-box .list-cell { | ||
+ | -fx-background-color: white; // Weißer Hintergrund für Textfeld und Liste | ||
+ | } | ||
+ | |||
+ | .label { | ||
+ | -fx-font-weight: bold; // Schrift in fett | ||
+ | } | ||
+ | |||
+ | .password-field { | ||
+ | -fx-border-color: transparent; // Rahmen transparent | ||
+ | -fx-background-color: yellow; // Hintergrund gelb | ||
+ | } | ||
+ | |||
+ | .progress-bar { | ||
+ | -fx-accent: cyan; // Balkenfarbe | ||
+ | -fx-control-inner-background: palegreen; // Hintergrundfarbe | ||
} | } | ||
Zeile 58: | Zeile 88: | ||
-fx-stroke: #ff0000; // Roter Rahmen | -fx-stroke: #ff0000; // Roter Rahmen | ||
-fx-fill: #0000ff; // Blau gefüllt | -fx-fill: #0000ff; // Blau gefüllt | ||
+ | -fx-stroke-type: outside; // Rahmen außerhalb des Rechtecks (Nebeneffekt: Anti-Aliasing verschwindet) | ||
} | } | ||
Zeile 81: | Zeile 112: | ||
-fx-background-color: #dddddd; // hellgrau | -fx-background-color: #dddddd; // hellgrau | ||
-fx-border-color: transparent transparent red transparent; // roter Rand an der rechten Seite | -fx-border-color: transparent transparent red transparent; // roter Rand an der rechten Seite | ||
+ | } | ||
+ | |||
+ | .table-cell { | ||
+ | -fx-alignment: center-left; // vertical zentriert und horizontal linksbündig | ||
+ | } | ||
+ | |||
+ | .table-row-cell { | ||
+ | -fx-cell-size: 32px; // Zeilenhöhe 32 Pixel | ||
+ | } | ||
+ | |||
+ | .table-view .column-header .label { | ||
+ | -fx-alignment: cemter-left; // Label im Column-Header linksbündig ausrichten | ||
+ | } | ||
+ | |||
+ | .table-view > .column-header-background > .nested-column-header > .column-header.table-column { | ||
+ | -fx-background-image: url("http://was-weiss-ich/image.jpg"); // Icon für Column-Header | ||
+ | -fx-background-repeat: no-repeat; | ||
+ | -fx-position: left center; | ||
+ | -fx-background-position: 4 4; | ||
} | } | ||
Zeile 96: | Zeile 146: | ||
-fx-padding: 2 6 2 6; // Abstand zwischen Text und Rand (open, rechts, unten, links) | -fx-padding: 2 6 2 6; // Abstand zwischen Text und Rand (open, rechts, unten, links) | ||
-fx-text-fill: red; // Textfarbe rot | -fx-text-fill: red; // Textfarbe rot | ||
+ | } | ||
+ | |||
+ | .tree-cell { | ||
+ | -fx-background-color: yellow; // Gelber Hintergrund | ||
+ | -fx-text-fill: red; // Textfarbe rot | ||
+ | } | ||
+ | |||
+ | .tree-table-cell { | ||
+ | -fx-background-color: yellow; // Gelber Hintergrund | ||
+ | -fx-text-fill: red; // Textfarbe rot | ||
+ | -fx-pref-height: 20px; // Bevorzugte Höhe 20px | ||
} | } | ||
</code> | </code> |