Hier sind alle Beiträge aufgelistet, die mit css-tipps verschlagwortet sind.
border-collapse "deaktiviert" border-radiusFür manche neu, für andere olle Kamelle: aber die Deklaration border-collapse: collapse; deaktiviert die abgerundeten Ecken, die man durch CSS3 erreichen will. Dabei werden sowohl die "offizielle" Eigenschaft (border-radius) als auch die browserspezifischen Eigenschaften (zum Beispiel -moz-border-radius) übergangen.
Siehe auch CSS Backgrounds and Borders Module Level 3 von W3C.
Der Hintergrund der ganzen Sache ist, dass ich letztens vor hatte auch den Tabellen im Artikel Tastaturkürzel für schnelleres Schreiben im WordPress-Editor abgerundete Ecken zu spendieren, so wie ich es schon hier im Artikel CSS3 und abgerundete Ecken beschrieben habe. (weiterlesen…)
Hinweis:
300+ Professionelle WordPress-Themes
Premium WordPress-Themes, 38 davon mit deutschem Support
Welcher Webdesigner wünscht sich das nicht: Grafiken und farbige Ebenen übereinander zu lagern und die untere durch die obere durchscheinen zu lassen und dies schnell, unkompliziert ohne Hilfe von Photoshop-Trickkiste und ressourcensparend durchzuführen. Dies alles ist mit CSS3 möglich. Schauen wir uns die Möglichkeiten, die uns die Eigenschaft opacity und RGBA ermöglichen.
Hinweis: die folgenden Beispiele funktionieren nur in modernen Browsern: Firefox und andere aktuelle Mozilla-Geschwister, Safari, Google Chrome und Opera. (weiterlesen…)
Hinweis:
WordPress 3.5 für Autoren & Redakteure
Der schnelle und unkomplizierte Einstieg auf 44 DIN-A4-Seiten
Im Anschluss an den Artikel CSS3 und abgerundete Ecken widme ich mich jetzt den Schatteneffekten für Text und Boxen. Bevor ich anfange, möchte ich einen Hinweis loswerden: die folgenden werden nur in modernen Browsern – Firefox, Safari, Chrome, Opera und dem IE9 – angezeigt. Leider werden die inline CSS-Angaben auch im Google Reader ignoriert. Aber da ist kein Bug, sondern lediglich ein Grund mehr um die Website zu besuchen.
text-shadowBei dem Schatten für Text gibt es freundlicherweise lediglich eine Eigenschaft text-shadow und man muss daher nicht browserspezifisches Gematsche berücksichtigen. Die Eigenschaft wird nach folgendem Muster notiert: (weiterlesen…)
Hinweis:
WordPress 3.5 für Autoren & Redakteure
Der schnelle und unkomplizierte Einstieg auf 44 DIN-A4-Seiten
Abgerundete Ecken sind ein beliebtes Mittel um das Layout einer Website aufzupeppen. Um abgerundete Ecken zu erreichen gibt es mehrere Ansätze: per Javascript, mit verschachtelten div-Blöcken und Grafiken oder mit Hilfe von CSS3.
Im folgenden werde ich mich der Lösung mit CSS3 widmen. Bei dieser Lösung bleiben ältere Versionen vom Internet Explorer außen vor. Seit der Version 9 des Internet Explorers (IE) beherrscht auch dieser Browser abgerundete Ecken, die per CSS3 realisiert werden. (weiterlesen…)
Die zwei englischsprachigen Artikel Single-Line vs Multi-Line CSS und Single Line CSS haben mich dazu gebracht ein paar Worte dazu zu schreiben wie ich meinen CSS-Code organisiere und warum ich es so mache. In den folgenden Beispielen, gehe ich von der Arbeit eines einzelnen Webworkers aus, da man sich in Gruppen auf ein gemeinsames Vorgehen einigen sollte. (weiterlesen…)
Du bietest doch einen vollen Newsfeed anund
Auf deine Website steht kein Hinweis, dass man die Inhalte nicht 1:1 übernehmen darf.
Was man mit CSS alles machen kann zeigt die Demo von Roman Cortes. Er hat mit jede Menge div-Elementen und CSS das Portrait von Homer Simpson gezeichnet. Einfach mal in den Quelltext schauen.
Ned Batchelder hat die Demo erweitert und daraus mit ein bisschen jQuery eine Animation erstellt.
Vielen Dank an Sahanya für den Hinweis.