…im Webstandard Blog zum Thema “CSS Transform und Transition am Beispiel eines Call-to-Action-Elementes”
Schlagwort: css3
”CSS3 & Responsive Web” – CSS3 Adventskalender Tag 3
Heute gibt es das 3. Türchen im CSS3 Adventskalender etwas später. Ich bin heute beim Multimediatreff in Köln eingeladen um über CSS3 & Responsive Web zu sprechen. Die Slides vom Vortrag werden nach dem Vortrag hier gegen 14 Uhr veröffentlicht. Bis dahin kann man den Multimediatreff auch im Live-Stream verfolgen. Hochkarätige Vorträge sind zu erwarten, u.a. zum Thema HTML5 von Patrick H. Laucke (Opera) sowie Peter Kröner (@sir_pepe) oder zum Thema „JavaScript: Von einfachen Scripten zu komplexen Anwendungen“ von Mathias Schäfer (@molily).
Die Slides
Das Video vom Vortrag
Gradient Border – CSS3 Adventskalender Tag 1
Tag 1 im CSS3 Advancedkalender und wir gehen gleich ins Eingemachte! ;)
In der CSS Text Level 3 Spezifikation gibt es seit einiger Zeit die Eigenschaft text-decoration-color
mit der man die Text-(Link-)Unterlinie andersfarbig gestalten kann. Bisher wird diese Eigenschaft laut MDN nur vom Firefox ab der Version 6 mit dem Prefix -moz- unterstützt. Zukünftig soll es ähnlich wie auch für border oder outline möglich sein für text-decoration
Shorthand-Values wie folgt anzugeben:
anzugeben. Das ist ein Vorteil, wenn weitere Browser das unterstützen. Auf perun.net gibt es bereits einen umfassenden Artikel über CSS3 text-decoration.
text-decoration: <text-decoration-line> || <text-decoration-color> || <text-decoration-style> || blink
Gradient Border – CSS3 Adventskalender Tag 1 weiterlesen
CSS3 Adventskalender 2011
Das gute Feedback zum CSS3 Adventskalender 2010 hat uns angespornt auch in diesem Jahr wieder einen CSS3 Adventskalender zu betreiben. Wie letztes Jahr werden im Webstandard-Blog und hier abwechselnd jeden Tag ein Artikel rund ums Thema CSS3 und moderne Webentwicklung veröffentlicht. Ab dem 01. Dezember 2011 heißt es also CSS3 Advancedkalender! ;) Jetzt schlagt keine Purzelbäume, wir werden nicht die neusten Spezifikation des CSS Working Group durchgehen, sondern zeigen alltagsrelevante Umsetzungen mit CSS3. Seid gespannt!
Gastautoren
Zudem konnten wir dieses Jahr Gastautoren gewinnen, die Beiträge zum CSS3 Advancedskalender beisteuern werden. Einen großen Dank an alle Gastautoren vorweg, da alle voll in Projekten stecken und nebenbei einen interessanten Artikel für uns schreiben. Hier im Blog werden Christian Schäfer (@derSchepp) und Hans Christian Reinl (@drublic) Artikel zum Thema CSS3 beisteuern. Im Webstandards-Blog gibt es Gastartikel von David Hellmann (@davidhellmann) und Jonas Hellwig (@_kulturbanause) – darüber freuen wir uns sehr!
Weihnachtsgeschenke für alle!
Als großes Weihnachtsgeschenk haben wir für unsere Leser vom Galileo Verlag und O’Reilly einige Bücher sowie Video Tutorials von Galileo zur Verlosung erhalten. Der Gesamtwert liegt bei über 450,- Euro! Von den insgesamt 9 Büchern und 4 Video-Trainings werden wir während der ganzen Adventszeit schon einige Exemplare verlosen und dann am 24.12.11 gibt es die große Weihnachtsverlosung.
Auf den üblichen Kanälen (Twitter, Google+, Facebook, RSS) werden wir euch also ab nächster Woche mit interessanten Themen zu CSS3 und Webentwicklung informieren. Stay tuned! hohoho! ;)
CSS3 im praktischen Einsatz
…lautet der Titel meines Vortrags auf der Web DevCon in Hamburg gestern. Eine Stunde lang habe ich über die aktuellen Einsatzmöglichkeiten von CSS3 erzählt.
Die HTML-Slideshow findet ihr hier: CSS3 im praktischen Einsatz
CSS3 im praktischen Einsatz weiterlesen
Internet Explorer 10 mit CSS3 linear-gradient Support
Microsoft ist aufgewacht und arbeitet kontinuierlich an der Weiterentwicklung des Internet Explorer. Gestern stellten Sie auf der MIX11 Konferenz in Las Vegas die neue Preview des IE10 vor. Umfangreiche Neuerungen sind bereits integriert.
Internet Explorer 10 mit CSS3 linear-gradient Support weiterlesen
IE9 mit CSS3 border-radius und linear-gradient Problemen
Nach Einführung des IE9 ist es nicht nur Fritz Weisshart aufgefallen, dass der IE9 zwar die propritären CSS-Eigenschaft „filter“ zum Erstellen von Verläufen, wie im IE6-8 zwar weiterhin unterstützt, aber diese nicht so funktionieren wie erhofft.
IE9 mit CSS3 border-radius und linear-gradient Problemen weiterlesen
WebKit ändert CSS3 Gradient Support und orientiert sich am Mozilla Syntax
Letzte Woche änderte das Webkit-Team die Syntax für CSS3 linear-gradient und radial-gradient und orientiert sich jetzt an der vom W3C favourisierten Syntax von Mozilla. Die Integration ist bereits in die Nightly Builds eingeflossen und wird sicherlich demnächst auch in die Webkit-basierenden Browser, wie Chrome oder Safari integriert.
Bisher hatte man recht viel Schreibarbeit, wenn man CSS3 Verläufe browserübergreifend einsetzen wollte. Im CSS3 Adventskalender Tag3 kann man die derzeitige Anweisungen cross-browser-fähig nachlesen. Zukünftig wird Webkit als Übergang auch weiterhin die bestehende Syntax unterstützen.
Man kann also die Eigenschaften für CSS3 Gradient wie folgt angeben:
.linear-top { /* Für WebKit alt (Safari, Chrome, etc.) */ background: -webkit-gradient(linear, left top, left bottom, ⏎ from(#c8482c), to(#fff)); /* NEU NEU NEU - WebKit (Safari, Chrome, etc.) */ background: -webkit-linear-gradient(top, #c8482c, #fff); /* Für Mozilla/Gecko (Firefox etc) */ background: -moz-linear-gradient(top, #c8482c, #fff); /* aktueller W3C working draft */ background: linear-gradient(top, #c8482c, #fff); }
Ein richtiger Schritt und auch ein Ereignis, bei dem man sieht, dass CSS3 noch in der Entwicklung ist. Trotzdem empfehle ich heute schon CSS3 einzusetzen, wo es geht.
CSS3 Adventskalender Tag 24
…im Webstandard Blog gibt es am letzten Tag des CSS3 Adventskalender noch ein Gewinnspiel: „Gewinne eines von 5 Hosting-Paketen – Universal- und Businesshosting„.
CSS3 Adventskalender Tag 24 weiterlesen
Fun with Border-Radius – CSS Sprechblasen – CSS3 Adventskalender Tag 23
Am vorletztem Tag des CSS3 Adventskalender will ich nochmal ein paar interessante Einsatzmöglichkeiten von border-radius zeigen. Nicht zuletzt auch durch das Gewinnspiel „Gewinne ein Jahres-Abo des Webstandards Magazin“ hat sich border-radius als das CSS3-Feature herauskristalisiert, auch die Zugriffszahlen zeigen das.
Fun with Border-Radius – CSS Sprechblasen – CSS3 Adventskalender Tag 23 weiterlesen