CSSEdit Tutorial: Die Grundlagen
CSSEdit ist, wie der Name schon sagt, ein CSS-Editor für den Mac. Es hat in der neuesten Version sprunghafte Fortschritte gemacht und ist jetzt eine der besten auf dem Mac verfügbaren Apps für Designer. CSSEdit wird von den großen Delopern bei MacRabbit erstellt, die auch für DeskShade verantwortlich sind.
Eine der stärksten Funktionen von CSSEdit ist die einfache, leicht zu navigierende und schöne Benutzeroberfläche. Sogar Leute, die keine Erfahrung im Stylen von Webseiten haben, können sich in dieser erstaunlichen App zurechtfinden und einige atemberaubende Webseiten erstellen. In diesem Tutorial werden wir uns die Benutzeroberfläche ansehen und herausfinden, wie Sie das Beste daraus machen können.
Entdecken Sie Envato-Elemente
Das Hauptfenster
Das Hauptfenster hat drei Hauptabschnitte, der erste Abschnitt (links) ist der Stilabschnitt. Hier sehen Sie alle Stile, die Sie auf Ihre Site angewendet haben. Der mittlere Bereich ist der eigentliche Editor der App. Hier erledigen Sie die gesamte Codierung Ihrer CSS-Datei mit der immer hilfreichen Funktion zur Code-Vervollständigung. Der rechte Bereich ist eine Möglichkeit, Ihre Seite zu gestalten, ohne etwas zu codieren. Sie können eingeben oder mit Dropdown-Feldern auswählen, wie Sie ein bestimmtes Element formatieren möchten, und der Code wird für Sie eingefügt. Dies ist eine großartige Funktion für alle, die CSS noch nicht kennen oder nicht sicher sind, wie sie eine bestimmte Technik codieren sollen.
Die Symbolleiste
Die Symbolleiste von CSSEdit verfügt über einige der besten Funktionen in der App und wird daher häufig verwendet, insbesondere bei fortgeschrittener Verwendung. Wir werden jedes Symbolleistensymbol einzeln durchgehen und erklären, was die einzelnen Funktionen tun.
Auf der linken Seite der Symbolleiste befinden sich 5 Werkzeuge. Das erste ist die neue Stilfunktion. Auf diese Weise können Sie Ihrem Stylesheet ganz einfach einen neuen Stil hinzufügen. Mit der zweiten Option können Sie bestimmte Stile in einem Ordner zusammenfassen, um die Navigation zu vereinfachen. Das dritte ist eine einfache Möglichkeit, einen Kommentar in Ihr Stylesheet einzufügen, ohne ihn manuell codieren zu müssen. Die vierte Methode ist eine erweiterte Methode zum Stylen von Elementen. Sie ermöglicht es Ihnen, ein bestimmtes Element überall dort zu formatieren, wo es in Ihrem Stylesheet angezeigt wird. Mit diesen vier Funktionen ist keine Codierung erforderlich. CSSEdit erledigt alles für Sie. Die fünfte Funktion ist eine einfache Suchfunktion, die nützlich ist, wenn Sie ein sehr großes Stylesheet haben.
Die rechte Seite der Symbolleiste enthält einige der erweiterten Funktionen von CSSEdit. Mit der ersten Option können Sie einen Link zum Stylesheet in eine HTML-Datei einfügen. Dadurch wird der HTML-Datei die CSS-Datei zugewiesen, um sie zu formatieren. Die zweite Möglichkeit ist die Vorschau Ihrer Webseite, ohne dass ein externer Webbrowser geöffnet werden muss. Der dritte wird als Meilensteine bezeichnet. Auf diese Weise können Sie Ihren aktuellen Fortschritt im Stylesheet speichern und im Fehlerfall zurückkehren. Mit der vierten Methode können Sie Ihr CSS überprüfen. Mit dem letzten Symbol können Sie ändern, welche drei Spalten der Hauptoberfläche angezeigt werden. Wenn Sie also nicht codieren können, können Sie Ihr CSS einfach bearbeiten, ohne dass eine Codierung erforderlich ist.
Wenn Sie diese App nicht haben, empfehle ich als Webentwickler ernsthaft, mehr bei MacRabbit zu lesen. Es ist wirklich das Ultimative bei der Erstellung von Stylesheets.
