de.hideout-lastation.com
Paradies Für Designer Und Entwickler


Diese Galerie von Pure CSS Icons ist was alle Frontend-Entwickler wollen

Adobe-Designer Wenting Zhang hat eine interessante Web-App zum Erzeugen reiner CSS-Icons erstellt . Es heißt einfach "CSS Icon" und ist vielleicht einer der coolsten Icon-Generatoren für Frontend-Entwickler.

Dieses Projekt ist komplett kostenlos und auf GitHub open-sourced, so dass Sie frei sind mit jedem der Codes herunterladen und durcheinander bringen.

Diese Symbole haben keine CSS-Abhängigkeiten oder benötigen spezielle Browserfunktionen. Auf den ersten Blick mag es so aussehen, als würden die Icons auf SVGs aufgebaut, aber sie sind eigentlich nur Divs .

Durch die Magie von CSS können Sie benutzerdefinierte Liniensymbole für gängige Oberflächenelemente wie das Hamburgermenü, das Dreipunktsymbol oder das Druckersymbol (neben vielen anderen) erstellen .

Sie können zwischen dünnen Liniensymbolen oder dunkel gefüllten Symbolen wählen. Beide verwenden ähnliche CSS-Eigenschaften und Sie können sogar sehen, was sie sind, indem Sie auf ein Symbol in der Liste klicken. Sie sehen eine verschiebbare Seitenleiste mit dem HTML- und CSS-Code und dem vergrößerten Symbol.

Wenn Sie in die obere rechte Ecke der Codefelder schauen, sehen Sie ein kleines Kopiersymbol . Klicken Sie darauf, um den Code automatisch in Ihre Zwischenablage zu kopieren . Oh, und dieses Kopiersymbol? Auch mit reinem CSS-Code von Wenting erstellt.

Um die Farbe eines Symbols zu ändern, suchen Sie einfach die Eigenschaft color in der Hauptsymbolklasse. Das Aktualisieren dieser einen color ändert auch alles andere.

Da diese Symbole ziemlich einfach sind, werden sie wahrscheinlich nicht für jede Website funktionieren. Aber das ist eine coole Alternative zu Bildern oder Icon-Schriften und es ist völlig kostenlos .

Auf der Homepage des CSS-Symbols finden Sie weitere Beispiele und können die Quelle kopieren / bearbeiten . Sie können jedes Symbol auch einzeln in CodePen testen, wenn Sie mit der Quelle in Ihrem Browser herumspielen möchten.

So aktivieren Sie CSS-Transformation in IE6-8 [Quick-Tipp]

So aktivieren Sie CSS-Transformation in IE6-8 [Quick-Tipp]

Moderne Browser unterstützen die meisten CSS3-Eigenschaften. Sie können CSS-Animationen, Transformationen und Verläufe unter anderem problemlos anwenden. Es gibt jedoch immer noch viele Benutzer älterer Versionen von Internet Explorer-Versionen, die die neueren CSS3-Eigenschaften nicht genau unterstützen . In

(Tech- und Design-Tipps)

15 Facebook App Tipps und Tricks für Android-Handys

15 Facebook App Tipps und Tricks für Android-Handys

Seien wir ehrlich, viele von uns nutzen Facebook immer noch täglich, sei es zu Hause, bei der Arbeit oder wenn Sie draußen mit Ihren Freunden abhängen. Dies bedeutet, dass Sie die meiste Zeit über Facebook auf Ihrem Handy verwenden und die Benutzeroberfläche der mobilen App ein wenig komplizierter ist . Ein

(Tech- und Design-Tipps)