4 gratis og gode verktøy for redigering av CSS-koden

Nettsteder er vidunderlige verktøy som formidler all slags informasjon og ideer. De har utviklet seg ganske mye på bare 10 til 15 år, og de forventes nå å være toppkvalitet og vakkert designet. Selvfølgelig er det teknologier som hjelper oss med å oppnå dette - dermed evolusjonen - med CSS som den viktigste ansvaret for design og andre estetiske aspekter av nettstedet ditt.

CSS 5 Baby trinn til å lære CSS og bli en kick-ass CSS Sorcerer 5 Baby trinn for å lære CSS og bli en Kick-Ass CSS Sorcerer CSS er de mest viktige endring websidene har sett i det siste tiåret, og det banet vei for adskillelsen av stil og innhold. På den moderne måten definerer XHTML den semantiske strukturen ... Les mer, eller Cascading Style Sheets, er bare et oppslagsspråk - som HTML - bortsett fra at det bare inneholder egenskaper for koder. For eksempel, hvis du bruker

koder for teksten din, kan du angi alle slags attributter til

koder innenfor CSS og det vil bli brukt på alle disse områdene. Men hvor kan du teste ut alle dine CSS ideer?

Mozilla Thimble

Mozilla Thimble er et relativt nytt prosjekt som lar deg teste øyeblikkelige endringer i koden til en side. Skjermen er delt mellom koden og en forhåndsvisning av hvordan nettstedet vil se ut med gjeldende kode. Eventuelle endringer du gjør i koden, blir umiddelbart reflektert i forhåndsvisningen.

Thimble er hovedsakelig designet for å teste nettsider og deres HTML-kode, men du kan like godt teste CSS-koden din også ved å plassere den i tags.

Fordelen med å bruke Thimble er at du kan se endringene umiddelbart og hvordan CSS relaterer til HTML på siden.

Firebug

Firebug er et annet flott verktøy som har blitt anbefalt ganske ofte her på MakeUseOf. Det er en webutvidelsesutvidelse som, som Thimble, kan vise deg endringer som er gjort for å kode umiddelbart. Forskjellen mellom Thimble og Firebug er at Thimble er begrenset til hvilken som helst kode du legger inn i venstre boks, men med Firebug kan du endre koden til et hvilket som helst nettsted, selv om nettstedet ikke tilhører deg.

Endringene er ikke permanente og vil ikke overføres til webserveren, slik at alle endringer blir sett av alle andre, men Firebug lar deg lokalt endre koden for å prøve å oppnå forskjellige resultater. Du kan da ta funnene dine i Firebug og bruke dem til din faktiske kode.

Bluefish

Bluefish er et desktop tekstredigeringsprogram som spesialiserer seg på programmering og webutvikling. Det er ikke så visuelt spennende som å si Thimble eller Firebug, men hvis du bare trenger å kunne skrive koden i en fin editor, er Bluefish den som skriver den inn.

Det er ikke som andre tekstredigerere, da det inneholder sine egne kraftige søkefunksjoner, ubegrenset angre / gjenta, kan åpne tusenvis av filer samtidig, er kryssplattform, og mye mer.

Aptana Studio

Aptana Studio handler ikke bare om kodredigeringsopplevelsen, men det går mye lenger enn det. Programmet kan installeres som frittstående programvare eller som et Eclipse-plugin, så du har muligheter for hvordan du vil bruke den. Det prøver virkelig å hjelpe deg med dine kodebeslutninger ved å vise ting som hvilke nettlesere som støtter hvilke elementer.

Det hjelper også med hele opplevelsen ved å gjøre det enklere å skyve prosjektene dine på en git-server for enklere versjonskontroll, en innebygd terminal og feilsøkingsalternativer og tilpasningsalternativer. Som alt annet på denne listen, er det kryssplattform.

Konklusjon

Som du kan se, har du noen flotte alternativer når det gjelder din CSS-kode. Det avhenger egentlig av hvilket oppsett du foretrekker eller krever for å få den mest effektive arbeidsflyten eller de fleste funksjonene. Alle disse programmene eller tjenestene løser løse redigering av CSS-koden på egen måte, men de er helt fantastiske i det de gjør. Hvis du ikke er sikker på hva som kan være for deg, prøv dem alle! Hvis du vil, kan du også sjekke ut vår håndbok om hvordan Internett fungerer for å lære om andre språk på nettet!

Hva bruker du til å redigere CSS-koden din? Har du andre anbefalinger? Gi oss beskjed i kommentarene!

Bilde Kreditt: 3D fargerik bakgrunn via Shutterstock

Utforsk mer om: HTML, HTML5, Programmering, Webdesign, Webutvikling, Webmaster Tools, WYSIWYG Editors.