Erstellen Sie mit Sassline Basislinienraster im Web

Ein Großteil der Online-Inhalte ist textbasiert. Die Leser sind jedoch nicht daran interessiert, den Text auf Ihrer Website zu lesen, es sei denn, die Typografie ist gut gestaltet.

Sie könnten mit arbeiten benutzerdefinierte Frameworks, aber diese können sich einschränkend anfühlen. Versuchen Sie stattdessen Sassline, eine kostenlose Sass-basierte Bibliothek zum Erstellen perfekter Gitternetzlinien im Web.

Dieses kostenlose Tool funktioniert auf Sass, daher müssen Sie sich zunächst mit dieser Vorverarbeitungssprache auskennen. Wenn Sie noch nicht mit Web-Entwicklung vertraut sind, ist dies eine gute Idee üben Sie Ihr CSS und Sass, bevor Sie Sassline abholen.

Wenn Sie es erst einmal gelernt haben, werden Sie Layouts nie wieder auf dieselbe Weise entwerfen.

Zum Erstellen werden Rem-Einheiten verwendet Benutzerdefinierte Basislinien, die überall auf Ihren Text passen. Dies umfasst alle Ihre Kopfzeilen, Absätze, Blockanweisungen und alles.

Sassline verfügt über reaktionsfähige Haltepunkte, mit denen Sie Ihre Textgröße (und Zeilenhöhe) basierend auf dem Sassline-Raster automatisch anpassen können. Dies setzt auf Sass-Mixins, die Sass-Erfahrung erfordern, wenn Sie mit ihnen arbeiten möchten.

Deshalb empfehle ich dieses Tool ausdrücklich für erfahrene Webentwickler um ihren Workflow zu verbessern.

Die Demo-Seite bietet ein ziemlich klares Beispiel für die Funktionsweise dieses Grundlinienraster, einschließlich Listenelementen, Pull-Anführungszeichen und verschiedenen Kopfzeilengrößen.

Außerdem können Sie dies in Frontend-Frameworks wie Bootstrap einfügen, wenn Sie kleinere Änderungen am Code vornehmen möchten. Das Die gesamte Sassline-Bibliothek ist äußerst vielseitig und es sollte für Sass-Liebhaber überall ein Grundnahrungsmittel sein.

Um zu beginnen, besuchen Sie das GitHub-Repo und laden Sie eine Kopie der Quelldateien herunter.

Dort finden Sie auch Installationsanweisungen und einen Link zu diesem tollen Blogeintrag, der Sie durch die Sassline-Bibliotheksfunktion nach Funktion führt.