Haben Sie die CSS-Zeichnungen von Diana Smith gesehen? Atemberaubend. Diese gehen weit über die CSS-Zeichnungen hinaus, die eine flache SVG-Szene eher grob nachahmen, wie ich es vielleicht versuchen würde. Wir hatten das Glück, dass sie letztes Jahr einige ihrer CSS-Zeichentechniken hier veröffentlicht hat.
Nun, Diana hat auch die fünf wichtigsten CSS-Eigenschaften aufgelistet, die sie für diese Meisterwerke verwendet, und sie überraschen durch ihre Einfachheit
- border-radius
- box-shadow
- transform
- Verläufe
- overflow
…aber natürlich mit Schichten von Trickserei!
… für benutzerdefinierte abgerundete Elemente, die organische Objekte wie Gesichter nachahmen sollen, ist es unerlässlich, dass Sie sich mit allen acht verfügbaren Parametern der
border-radius-Eigenschaft vertraut machen.
Diana zeigt ihre berühmte Francine-Zeichnung mit jeweils ausgeschalteten am häufigsten verwendeten Eigenschaften
Schauen Sie sich unbedingt auch dieses VICE-Interview an, das sie gegeben hat. Sie behandelt Perlen wie die Tatsache, dass Francine von American Dad inspiriert wurde (lol) und dass die Cross-Browser-Fallbacks sowohl eine faszinierende als auch eine interessante Sauerei sind.
