Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- css:start [2015-01-10 17:10] – angelegt a.kamola
+++ css:start [2019-09-08 11:02] (aktuell) – "Debugging" eingefügt a.kamola
@@ Zeile 1: / Zeile 1: @@
 ====== CSS ======
+===== Reset =====
+Meist wird zu Beginn eines Stylesheets die Standard-Darstellung der Browser "zurückgesetzt", z.B. mittels:
+<code css>
+* {
+	margin: 0;
+	padding: 0;
+}
+</code>
+Alternativ dazu gibt es sogenannte "CSS Resets", die meist besser und umfangreicher sind:
+  * [[http://necolas.github.io/normalize.css/|normalize.css]]
+===== Debugging =====
+Fügt an alle HTML-Elemente einen transparent-roten Hintergrund und einen roten Rahmen an:
+<code css>
+html * {
+    background: rgba(255, 0, 0, .1);
+    box-shadow: 0 0 0 1px red;
+}
+</code>
+Quelle: [[https://dev.to/dink/comment/f20o|DEV Community: Re: My Favorite CSS Hack]]
+===== Zentrieren =====
+[[http://howtocenterincss.com/|How To Center In CSS]]
+===== calc() =====
+[[https://developer.mozilla.org/en-US/docs/Web/CSS/calc|MDN: calc()]]
+===== Leerzeichen in der Content-Eigenschaft =====
+Reguläre Leerzeichen in der Eigenschaft ''content'' werden nicht immer angezeigt, statt dessen muss ein geschütztes Leerzeichen eingesetzt werden, dies geht z.B. mit dem Unicode ''U00A0'':
+<code css>
+p:after {
+	content: '\00a0';
+}
+</code>
+Quelle: [[http://stackoverflow.com/a/5467676|Stack Overflow: Add a space (" ") after an element using :after]]
+===== Responsive Design =====
+> -webkit-text-size-adjust: 100%; has same effect as none in MobileSafari but doesn't prevent user from zooming text in desktop Safari.
+Quelle: [[https://twitter.com/shauninman/status/387088251082665984|@shauninman]]
+===== Animation =====
+  * [[animation|Animation mit CSS3]]
+===== Literatur =====
+  * Müller, Peter: //Einstieg in CSS: Webseiten gestalten mit HTML und CSS//. Rheinwerk Computing, 2015.
+    * [[https://www.rheinwerk-verlag.de/3806/|Reihnwerk-Verlag: Einstieg in CSS: Webseiten gestalten mit HTML und CSS]]
 ===== Links =====
+  * [[http://wiki.selfhtml.org/wiki/CSS/Anwendung_und_Praxis/Guter_CSS-Stil|SELFHTML-Wiki: Guter CSS-Stil]]
+  * [[https://pinboard.in/u:aberaberarne/t:css|Arnes Link-Sammlung zu CSS]]
 ==== Tutorials ====
@@ Zeile 8: / Zeile 76: @@
   * [[https://www.codeschool.com/paths/html-css|Code School: HTML/CSS]]
+  * [[https://www.video2brain.com/de/videotraining/html-und-css-fuer-designer|video2brain: HTML und CSS für Designer]]
+  * [[https://www.video2brain.com/de/videotraining/webprogrammierung-grundlagen|video2brain: Webprogrammierung: Grundlagen]]
+  * [[https://www.video2brain.com/de/videotraining/css-layouts-fuer-fortgeschrittene|video2brain: CSS-Layouts für Fortgeschrittene]]
+  * [[https://www.video2brain.com/de/videotraining/css-debuggen|video2brain: CSS debuggen]]
+  * [[https://www.video2brain.com/de/videotraining/css3-fuer-webdesigner|video2brain: CSS3 für Webdesigner]]
+  * [[https://www.video2brain.com/de/videotraining/animationen-in-css3|video2brain: Animationen in CSS3]]