Guten Morgen, > > Können wir vielleicht `box-sizing: border-box;` für den Universal-Selektor verwenden? Ich habe das mal eingefügt und die Regel ~~~ CSS * { border: medium solid green; } ~~~ besser erklärt. > > > > # [**Selektoren in CSS/Pseudoelemente**](https://wiki.selfhtml.org/wiki/Selektoren_in_CSS/Pseudoelemente) > > > > * wenig geändert, eig. nur Cards auf Anwendungsbeispiele eingefügt > > Das Kapitel hab' ich jetzt doch völlig neu aufgebaut. > > MDN [kennt noch ein paar weitere](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements) 😇 1. Hoffentlich besserer Einstieg, der auch gleich auf die Referenz verweist. 2. `::first-letter` und `::first-line` ~~`::first-letter`~~ vorgezogen Das sind einfache Beispiele, die man gleich versteht. 3. `::before` mit [einfachem Beispiel](Selektoren_in_CSS/Pseudoelemente#::before_und_::after), das dann ausgebaut wird. Das [Beispiel mit den Dreiecken](https://wiki.selfhtml.org/wiki/Selektoren_in_CSS/Pseudoelemente#Leere_Pseudoelemente) wollte ich eig. rausschmeißen, hab' ich aber doch dringelassen. 4. Das `::selection`-Beispiel habe ich entfernt und den Abschnitt über `::placeholder`in den Anhang verfrachtet. Insgesamt ist es jetzt 2KB kürzer als vorher und hoffentlich trotzdem verständlicher. **Bitte schaut das durch!** Zukünftig sollten da noch ein paar Cards auf * ein aktualisiertes details-Beispiel mit `::details-content` * ein Scroll-Karussell mit [::scroll-button()](https://wiki.selfhtml.org/wiki/CSS/Selektoren/scroll-button\(\)) und `::scroll-marker-group` * ein stylbares Select-Menü mit `::picker(select)`und `::checkmark` folgen. Aber immer eins nach zwei anderen. > > -------------- > > **Ich bitte euch alle, schaut Euch die Seiten an und gebt Feedback**, wo etwas nicht passt, noch unklar ist, oder postet Anwendungsbeispiele, die anderen helfen könnten. > > Hab unterwegs einige Typos gevespert. > > > Evtl könntet ihr auch Beispiele aus anderen Tutorials mit den neuen Selektoren, CSS-Nesting etc aufpeppen. > > Das gilt weiterhin! Herzliche Grüße Matthias Scharwies -- [bildung.social/@selfhtml](https://bildung.social/@selfhtml)

Guten Morgen, > > Können wir vielleicht `box-sizing: border-box;` für den Universal-Selektor verwenden? Ich habe das mal eingefügt und die Regel ~~~ CSS * { border: medium solid green; } ~~~ besser erklärt. > > > > # [**Selektoren in CSS/Pseudoelemente**](https://wiki.selfhtml.org/wiki/Selektoren_in_CSS/Pseudoelemente) > > > > * wenig geändert, eig. nur Cards auf Anwendungsbeispiele eingefügt > > Das Kapitel hab' ich jetzt doch völlig neu aufgebaut. > > MDN [kennt noch ein paar weitere](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements) 😇 1. Hoffentlich besserer Einstieg, der auch gleich auf die Referenz verweist. 2. `::first-letter` und `::first-letter` vorgezogen Das sind einfache Beispiele, die man gleich versteht. 3. `::before` mit [einfachem Beispiel](Selektoren_in_CSS/Pseudoelemente#::before_und_::after), das dann ausgebaut wird. Das [Beispiel mit den Dreiecken](https://wiki.selfhtml.org/wiki/Selektoren_in_CSS/Pseudoelemente#Leere_Pseudoelemente) wollte ich eig. rausschmeißen, hab' ich aber doch dringelassen. 4. Das `::selection`-Beispiel habe ich entfernt und den Abschnitt über `::placeholder`in den Anhang verfrachtet. Insgesamt ist es jetzt 2KB kürzer als vorher und hoffentlich trotzdem verständlicher. **Bitte schaut das durch!** Zukünftig sollten da noch ein paar Cards auf * ein aktualisiertes details-Beispiel mit `::details-content` * ein Scroll-Karussell mit [::scroll-button()](https://wiki.selfhtml.org/wiki/CSS/Selektoren/scroll-button\(\)) und `::scroll-marker-group` * ein stylbares Select-Menü mit `::picker(select)`und `::checkmark` folgen. Aber immer eins nach zwei anderen. > > -------------- > > **Ich bitte euch alle, schaut Euch die Seiten an und gebt Feedback**, wo etwas nicht passt, noch unklar ist, oder postet Anwendungsbeispiele, die anderen helfen könnten. > > Hab unterwegs einige Typos gevespert. > > > Evtl könntet ihr auch Beispiele aus anderen Tutorials mit den neuen Selektoren, CSS-Nesting etc aufpeppen. > > Das gilt weiterhin! Herzliche Grüße Matthias Scharwies -- [bildung.social/@selfhtml](https://bildung.social/@selfhtml)

Guten Morgen, > > Können wir vielleicht `box-sizing: border-box;` für den Universal-Selektor verwenden? Ich habe das mal eingefügt und die Regel ~~~ CSS * { border: medium solid green; } ~~~ besser erklärt. > > > > # [**Selektoren in CSS/Pseudoelemente**](https://wiki.selfhtml.org/wiki/Selektoren_in_CSS/Pseudoelemente) > > > > * wenig geändert, eig. nur Cards auf Anwendungsbeispiele eingefügt > > Das Kapitel hab' ich jetzt doch völlig neu aufgebaut. > > MDN [kennt noch ein paar weitere](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements) 😇 1. Hoffentlich besserer Einstieg, der auch gleich auf die Referenz verweist. 2. `::first-letter` und `::first-letter` vorgezogen Das sind einfache Beispiele, die man gleich versteht. 3. `::before` mit [einfachem Beispiel](Selektoren_in_CSS/Pseudoelemente#::before_und_::after), das dann ausgebaut wird. Das [Beispiel mit den Dreiecken](https://wiki.selfhtml.org/wiki/Selektoren_in_CSS/Pseudoelemente#Leere_Pseudoelemente) wollte ich eig. rausschmeißen, hab' ich aber doch dringelassen. 4. Das `::selection`-Beispiel habe ich entfernt und den Abschnitt über `::placeholder`in den Anhang verfrachtet. **Bitte schaut das durch!** Zukünftig sollten da noch ein paar Cards auf * ein aktualisiertes details-Beispiel mit `::details-content` * ein Scroll-Karussell mit [::scroll-button()](https://wiki.selfhtml.org/wiki/CSS/Selektoren/scroll-button\(\)) und `::scroll-marker-group` * ein stylbares Select-Menü mit `::picker(select)`und `::checkmark` folgen. Aber immer eins nach zwei anderen. > > -------------- > > **Ich bitte euch alle, schaut Euch die Seiten an und gebt Feedback**, wo etwas nicht passt, noch unklar ist, oder postet Anwendungsbeispiele, die anderen helfen könnten. > > Hab unterwegs einige Typos gevespert. > > > Evtl könntet ihr auch Beispiele aus anderen Tutorials mit den neuen Selektoren, CSS-Nesting etc aufpeppen. > > Das gilt weiterhin! Herzliche Grüße Matthias Scharwies -- [bildung.social/@selfhtml](https://bildung.social/@selfhtml)