Blog zu den Themen Webentwicklung, technisches Online Marketing und Suchmaschinenoptimierung

Video-Tutorial: 5 CSS3-Tricks die du vielleicht noch nicht kennst

Da das gestrige und erste Video-Tutorial Einfacher AJAX-Request mit Hilfe von jQuery laut den Blogkommentaren doch besser ankam als ich dachte, habe ich mich entschlossen, dass Video-Bloggen weiter zu verfolgen und in Zukunft regelmäßig Video-Tutorials auf meinem Blog zu veröffentlichen.

Auf meinen Streifzügen durchs Web fallen mir immer mal wieder CSS3-Eigenschaften auf, die man regelmäßig wiederfindet. Dazu gehören beispielweise border-radius, um Elemente abzurunden, oder box-shadow, um einen Schlagschatten zu definieren. Andere Eigenschaften sind hingegen weniger bekannt, obwohl sich mit Ihnen auch häufig produktive Sachen anstellen ließen. Um fünf dieser CSS3-Eigenschaften und -Selektoren soll es im heutigen Video gehen.

Wie bereits beim letzten Video empfehle ich, dass Video in seiner nativen Auflösung zu betrachten. Bei Vimeo sollte man dafür die HD-Variante wählen.

Verwendete Datei: index.html

Da es sich in diesem Beispiel der Übersichtlichkeit wegen um einen Inline <style>-Block gehandelt hat, war nur eine Datei nötig. Den Inhalt der finalen index.html gibt es hier:

Weiterführende Informationen zu den verwendeten CSS3-Elementen

Dieser Artikel wurde am 20.01.2012 veröffentlicht

Wer schreibt hier?

Torben Leuschner - Webentwickler

Hi, ich bin Torben und baue leidenschaftlich gerne Webseiten. Also habe ich mein Hobby zum Beruf gemacht und bin seit 2008 als Webentwickler Selbständig tätig. Obwohl ich schwerpunktmäßig für Kunden arbeite habe ich auch sehr viel Freude an der Realisierung eigener Projekte. Daraus resultierend hat sich eine große Affinität zu den Themen Online Marketing und Suchmaschinenoptimierung entwickelt. Gelegentlich schreibe ich auf Twitter, viel aktiver bin ich allerdings auf Facebook. Gerne können wir uns dort vernetzen!

Wie stehst du dazu?

  1. Ich glaube weil ich bei Vimeo dafür Plus-User sein muss… und zahlen will ich nicht. Youtube hingegen lässt mich wegen einem kleinen Verstoß vor zwei Jahren keine Video über 15 Minuten hochladen….
    Ich glaube ich bau in mein Theme ein Video-Template ein und setze auf HTML5 Video.

  2. Also als ich noch bei Vimeo war (etwa 1 Jahr her) konnte man es auch so aktivieren, aber egal, ist auf jeden Fall auch ein besuch wert bei Vimeo :-)

    Bei deinen Lesern musst du ja nicht befürchten das jemand einen Browser verwendet der noch kein HTML5 unterstützt…

  3. input[type=submit] gibt es bereits seit CSS Level 2.1 und benötigt standardmäßig keine „auto“-Breite,da ohne explizite Angabe ohnehin auto verwendet wird.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.