| ... |
... |
@@ -10,7
+10,7 @@ |
| 10 |
10 |
|
| 11 |
11 |
Eine Liste von speziellen Selektoren innerhalb von {{formcycle case="dat"/}} findet sich unter [[Selektoren>>doc:Formcycle.FormDesigner.CodingPanel.Selector]]. |
| 12 |
12 |
|
| 13 |
|
-== Hilfeseiten und Tutorials zu jQuery == |
|
13 |
+== Hilfeseiten und Tutorials zu CSS == |
| 14 |
14 |
|
| 15 |
15 |
=== CSS-Selektoren === |
| 16 |
16 |
|
| ... |
... |
@@ -24,10
+24,10 @@ |
| 24 |
24 |
|
| 25 |
25 |
== Beispiele == |
| 26 |
26 |
|
| 27 |
|
-Hier werden Standardwerte für das Formular gesetzt. In dem für das Formular eine Schriftgröße in Pixel gesetzt wird, können für alle anderen Elemente die CSS-Einheiten //em //bzw. //rem// verwendet werden. Wird später die Schriftgröße des Formulars geändert, ändern sich alle anderen Schriftgrößen proportional. |
|
27 |
+Hier werden Standardwerte für das Formular gesetzt. In dem für das Formular eine Schriftgröße in Pixel gesetzt wird, können für alle anderen Elemente die CSS-Einheiten //em //verwendet werden. Wird später die Schriftgröße des Formulars geändert, ändern sich alle anderen Schriftgrößen proportional. |
| 28 |
28 |
|
| 29 |
29 |
{{code language="CSS"}} |
| 30 |
|
-FORM.xm-form { /* Selektiert das gesamte Formular |
|
30 |
+FORM.xm-form { /* Selektiert das gesamte Formular */ |
| 31 |
31 |
font-size: 16px; /* Setzt die Basisschriftgröße. */ |
| 32 |
32 |
color: #111; /* Setzt die Default-Schriftfarbe. */ |
| 33 |
33 |
font-family: Arial; /* Setzt die Default-Schriftart. */ |
| ... |
... |
@@ -38,7
+38,7 @@ |
| 38 |
38 |
Hiermit werden alle Texten mit der Klasse //hoherText// groß dargestellt. Die Klasse kann im {{designer case="dat"/}} rechts unter [[CSS Klassen>>doc:Formcycle.FormDesigner.ElementProperties.CSSClasses]] Elementen gegeben werden. |
| 39 |
39 |
|
| 40 |
40 |
{{code language="CSS"}} |
| 41 |
|
-.hoherText .XTextField { /* Selektiert alle Texte mit der Klasse hoherText |
|
41 |
+.hoherText .XTextField { /* Selektiert alle Texte mit der Klasse hoherText */ |
| 42 |
42 |
height: 60px; /* Setzt die Höhe des Feldes auf 60 Pixel */ |
| 43 |
43 |
font-size: 40px; /* Setzt die Schriftgröße auf 40 Pixel. */ |
| 44 |
44 |
font-weight: bold; /* Macht den Text fett. */ |
| ... |
... |
@@ -66,6
+66,6 @@ |
| 66 |
66 |
Auch für die Werte von CSS-Eigenschaften stehen sowohl die Autovervollständigung als auch erklärende Hilfetexte bereit. Wurde der Designer neu geladen, werden die Beschreibungen ausgeblendet. Sie können angezeigt werden, in dem in der Liste der Vorschläge rechts auf das blaue {{icon name="info-circle"/}} geklickt wird. |
| 67 |
67 |
{{/figure}} |
| 68 |
68 |
|
| 69 |
|
-{{figure image="designer_advanced_css_search_replace.png" width="700" float="none"}} |
|
69 |
+{{figure image="designer_advanced_css_search_replace_de.png" width="700" float="none"}} |
| 70 |
70 |
Wird eine CSS-Datei länger, kann es schwierig werden, bestimmte Stellen wiederzufinden. Abhilfe schafft hier die Suche. Die Suchleiste erscheint rechts oben im Editor durch Drücken von Strg + F. Hier kann ein Text eingegeben werden, nachdem in der CSS-Datei gesucht werden soll. Optional kann die Suche über die Icons rechts in der Suchleiste auch die Groß- und Kleinschreibung berücksichtigen. Schließlich ist auch ein Suchen und Ersetzen von Textpassagen möglich, indem entweder Strg + H oder in der Suchleiste link auf den Pfeil gedrückt wird. |
| 71 |
71 |
{{/figure}} |