CSSEdit-zelfstudie: de basis
CSSEdit is, zoals de naam al aangeeft, een CSS-editor voor de Mac. Het is met sprongen vooruit gegaan in de nieuwste versie en is nu een van de beste apps die beschikbaar zijn op de Mac voor ontwerpers. CSSEdit is gemaakt door de grote delopers bij MacRabbit, die ook verantwoordelijk zijn voor DeskShade.
Een van de sterkste kenmerken van CSSEdit is de eenvoudige, gemakkelijk te navigeren en mooie interface. Zelfs mensen die geen ervaring hebben met het vormgeven van webpagina's kunnen hun weg vinden in deze geweldige app en een aantal verbluffende webpagina's maken. In deze tutorial gaan we kijken naar de interface en hoe je er het maximale uit kunt halen.
Verken Envato Elements
Het hoofdvenster
Het hoofdvenster heeft drie hoofdsecties, de eerste sectie (aan de linkerkant) is de stijlsectie. Hier ziet u alle stijlen die u op uw site heeft toegepast. Het middelste gedeelte is de eigenlijke editor van de app, hier doe je alle codering van je css-bestand allemaal met de altijd handige functie voor het aanvullen van code. Het rechtergedeelte is een manier om uw pagina te stylen zonder iets te coderen. U kunt typen of selecteren met vervolgkeuzelijsten hoe u een bepaald element wilt stylen en de code wordt voor u ingevoegd. Dit is een geweldige functie voor iedereen die nieuw is bij CSS of voor iedereen die niet zeker weet hoe hij een bepaalde techniek moet coderen.
De werkbalk
De werkbalk van CSSEdit heeft een aantal van de beste functies in de app en wordt daarom nogal gebruikt, vooral bij meer geavanceerd gebruik, we zullen elk werkbalkpictogram een voor een doornemen en ik zal uitleggen wat iedereen doet.
Aan de linkerkant van de werkbalk zijn er 5 gereedschappen, de eerste is de nieuwe stijlfunctie, hierdoor kunt u vrij eenvoudig een nieuwe stijl aan uw stylesheet toevoegen. Met de tweede kunt u bepaalde stijlen groeperen in een map, zodat u er gemakkelijker doorheen kunt navigeren. De derde is een eenvoudige manier om een opmerking aan uw stylesheet toe te voegen zonder deze handmatig in te hoeven voeren. De vierde is een geavanceerdere manier om elementen te stylen, het stelt je in staat om een bepaald element te stylen waar het in je stylesheet verschijnt. Met deze vier functies is codering niet nodig, CSSEdit doet het allemaal voor je. De vijfde functie is een eenvoudige zoekfunctie, handig als je een heel groot stylesheet hebt.
De rechterkant van de werkbalk bevat enkele van de meer geavanceerde functies van CSSEdit. Met de eerste kun je een link naar het stylesheet in een HTML-bestand invoegen, dit wijst het HTML-bestand het CSS-bestand toe om het op te maken. De tweede is een manier om uw webpagina te bekijken zonder een externe webbrowser te hoeven openen. De derde heet Milestones, het is een manier om je huidige voortgang in het stylesheet op te slaan, zodat je terug kunt draaien als er een fout is gemaakt. De vierde is een manier om uw CSS te valideren en met het laatste pictogram kunt u wijzigen welke drie kolommen van de hoofdinterface u kunt zien, wat betekent dat als u niet kunt coderen, u eenvoudig uw CSS kunt bewerken zonder codering.
Als je deze app niet hebt, raad ik als webontwikkelaar serieus aan om meer te lezen op MacRabbit. Het is echt het ultieme in het maken van stylesheets.