11 Top Editori CSS - Revizuit

1. Stylitor

Compatibilitate: ferestreCaracteristică notabilă: Grilă de cod, Mărimea gripilor, Bullseye, Două clicuri de colorare

Stylizer este un editor CSS absolut unic pe care se concentrează editarea CSS în timp real. Puteți introduce o adresă web în browser-ul încorporat care acceptă definiția stilului Firefox 3.5 și IE7 și ar fi încărcat toate regulile CSS asociate pentru a vă edita cu interfața familiară punct-și-clic.

Editorul vine cu un Grilă de cod care face ca editarea dvs. CSS să fie mai convenabilă, deoarece puteți vedea rezultatul imediat după ce ați modificat o valoare. De asemenea, cu diagnosticul său Punct ochit punct lovit , puteți vizualiza elementele asociate la o anumită parte a site-ului și îl puteți edita cu puncte și clicuri. Alte caracteristici cum ar fi Mărimea mânerelor vă permite să reglați vizual poziția unui element CSS și cu Clic pe două culori caracteristică vi se oferă un selector de culori asemănător cu Photoshop pentru a alege orice culoare pentru, de exemplu, fontul site-ului. Oh, am mentionat ca toate aceste editari se fac in timp real, rezultat imediat vizibil?

Cu Stylizer este imposibil să faci o greșeală CSS deoarece ar limita orice valoare care nu este compatibilă cu proprietatea CSS corespunzătoare. Cu toate acestea, software-ul nu ar fi reușit să încarce anumite fișiere CSS uneori, din cauza erorii critice inexplicabile.

Stylizer vine cu versiunea Basic și Ultimate. În timp ce versiunea de bază este complet gratuită, versiunea Ultimate este disponibilă dvs. timp de 14 zile după instalare, atunci vă oferă 85 USD pentru ca dvs. să continuați să utilizați funcțiile avansate precum Bullseye.

2. TopStyle

Compatibilitate: ferestreCaracteristică notabilă: Style Inspector, Măturătoare de stil, CSS Tidy

Editorul TopStyle CSS începe să vă uimească după prima configurare a acestuia, când puteți alege o definiție de stil care afișează numai proprietăți și valori suportate fie de Firefox, Internet Explorer, Safari, fie chiar de iPhone OS 2.0, ceea ce este practic util pentru cross-platform web designer.

Printre toate caracteristicile pe care le-am găsit Inspector de stil este utilă în special deoarece funcționează ca un panou care vă permite să includeți orice proprietate CSS cu o interfață simplă de tip point-and-click. Când ați terminat alegerea tuturor proprietăților CSS pe care le doriți, codul sursă va fi generat automat pentru a vă salva timpul de codificare repetitivă și obositoare.

Un alt lucru bun despre TopStyle se arată compatibilitatea browser-ului sub inspectorul său de stil, pe care o puteți vedea fie că proprietatea CSS este pe deplin acceptată de o anumită versiune a browser-ului Web, cum ar fi Internet Explorer 7, sau este teribil de buggy.

Editorul vine ca o versiune de încercare cu caracteristică limitată, și vă puteți debloca întregul său potențial cu 79.95 dolari.

3. Masterul stilului

Compatibilitate: Windows, Mac OS XCaracteristică notabilă: Șablon de șablon

Revendicat ca un maestru, Masterul de stil a făcut destul de bine pentru a crea un mediu de editare CSS pentru orice nivel de expertiză. Software-ul nu oferă doar editorul WYSIWYG care umple fluxul de lucru pentru începător CSS, ci vă oferă și accesul la informațiile foarte detaliate despre fiecare proprietate CSS pe care specialistul o poate face referire. Puteți căuta și alege proprietățile CSS fie în funcție de categorie, fie în ordine alfabetică.

Poate că punctul cel mai unic este editorul în sine conține aproape 20 de șabloane șabloane utile pentru a începe, și nu este surprinzător faptul că un maestru de stil are reguli foarte clare, bine aranjate și profesioniste, definite în șablonul încorporat.

Vă puteți bucura de software-ul complet de 30 de zile și puteți plăti fie 59,99 dolari, fie 29,99 dolari pentru ca licența de învățământ să-și deschidă din nou întregul potențial.

4. Xyle Domeniul de aplicare

Compatibilitate: MacCaracteristică notabilă: Mod de selecție, Grup inteligent, Integrare editor text

Xyle Scope este a trebuie să aibă editor gratuit CSS pentru Mac, deoarece este un editor CSS cu adevărat profesionist care vă permite să navigați pe site și să reglați CSS direct în interiorul editorului.

Browser-ul lui Xyle vine cu modul normal de navigare și modul de selecție, care funcționează destul de asemănător cu plugin-ul Firefox, Firebug care oferă vizualizarea și editarea sursei CSS, cu excepția faptului că editorul vă permite să salvați valori CSS modificate în locația lor originală.

Folosind "Grupul inteligent', puteți să eliminați toate regulile care influențează modul în care sunt afișate linkurile sau cei responsabili pentru aspect, puteți chiar să restrângeți rezultatul cu funcția de căutare încorporată, nu mai aveți nici o metodă de încercare și de eroare!

Xyle Scope oferă de asemenea integrare cu editorii de text extern, cum ar fi BBEdit, pentru o operațiune de codificare mai convenabilă și mai eficientă, doar faceți o schimbare și fie editorul de text, fie Xyle Scope ar actualiza automat toate modificările pentru dvs..

5. CSS rapidă

Compatibilitate: ferestreCaracteristică notabilă: Modificator de sintaxă, finalizarea codului, formatarea CSS

Rapid CSS este calea pentru editare CSS mai confortabilă, convenabilă și complexă. Acesta are propriul editor de text complet personalizabil cu funcții utile, cum ar fi evidențierea sintaxei, completarea codului și referința CSS încorporată pentru experiența codificării dureroase.

Privind curățenia CSS, puteți să vă formatați foaia de stil CSS, cum ar fi să le rearanjați după tipul CSS sau să creați proprietăți de stenografie pentru a face foaia de stil să fie mai confortabilă și dulce. Validatorul de cod încorporat asigură, de asemenea, că foaia de stil nu este doar curată, ci valabilă.

Editorul vine cu o perioadă de evaluare de 30 de zile cu 30 de utilizări, puteți merge pentru versiunea completă cu $ 29.85.

6. Stil Studio

Compatibilitate: ferestreCaracteristică notabilă: CSS Wizard, IntelliStyle

Principala frumusețe a Studio Style se află în cadrul funcției CSS Wizard, care funcționează pentru a vă oferi un efect imediat CSS cu câteva puncte și clicuri.

De exemplu, puteți selecta un expert pentru fonturi, apoi alegeți o familie de fonturi și setați o dimensiune a fontului, apoi stilul fontului, greutatea, varianta ... și boom-ul! Regulile sunt inserate în foaia de stil ca un cod CSS complet validat.

Printre funcțiile Wizard se numără și culoarea, marginea, textul, poziționarea, clasificarea și, în final, regulile de filtrare, doar aproape tot ce vă puteți gândi la CSS. Aceste vrăjitori sunt destul de utile, deoarece nu este nevoie să tastați în mod repetat pentru a obține un anumit efect CSS complicat. O altă caracteristică nobilă este IntelliStyle, care funcționează ca o completare de cod pentru a alege anumite proprietăți CSS pentru scopul dvs. de proiectare.

Dezavantajul acestui editor ar fi suportul definitiv al stilului browserului său, deoarece acesta suportă numai IE6 și, bine, nici un Firefox.

Vi se acordă 30 de zile pentru a vă bucura de software și 49,99 USD pentru achiziționarea acestuia.

7. CSSEdit

Compatibilitate: MacCaracteristică notabilă: Inspector de raze X, editor vizual, selector builder

Proiectați site-uri frumoase, inovatoare și rapid de încărcare cu o aplicație frumoasă, inovatoare și rapidă, care este CSSEdit by MacRabbit. De la caracteristici precum Selector Builder până la mediu sursă inteligentă, CSSEdit este proiectat pentru orice nivel de expertiză.

Cu editorul foarte lustruit ca acesta, vă așteaptă să vedeți schimbări în foaia dvs. de stil CSS apărute în timp real, fără o acțiune obositoare de încărcare și reîmprospătare. Inspectorul de raze X este, de asemenea, creat ca o caracteristică pentru a diagnostica codul CSS din anumite părți ale site-ului.

Partea inovatoare a CSSEdit este probabil ei Selectorul Builder care vă permite să descrieți stilul dvs. CSS cu limba engleza simplă, nu prea mult interes pentru un expert, dar util pentru începător absolut.

Versiunea demo vă limitează să salvați fișierul cu mai puțin de 2500 de caractere, în timp ce puteți plăti 39,95 dolari pentru a șterge toate restricțiile.

8. Editorul EnginSite CSS

Compatibilitate: ferestreCaracteristică notabilă: Instrument de măsurare în modul Previzualizare

Dacă sunteți un designer serios care are grijă de specificația CSS corectă, plasarea corectă a CSS sau foaia dvs. de stil CSS trebuie să fie validată pe deplin, atunci editorul EngInSite CSS poate fi editorul dvs. preferat.

În acest editor puteți adăuga selector de clase, id și elemente cu ajutorul inspectorului încorporat, de asemenea puteți converti culoarea fie la valoarea Hex sau RGB, ceea ce este o caracteristică foarte rară pentru un editor CSS. Puteți observa rezultatul în panoul de previzualizare cu ajutorul instrumentelor de măsurare pentru a vă asigura că fiecare element de design este în poziția corectă.

Editorul vine, de asemenea, cu finalizarea codului, dar este puțin buggy, așa că aș spune că este completarea semicodului. În caz contrar, întregul editor este frumos de utilizat, cu excepția faptului că editorul este destul de depășit în termeni de suport de defensivitate al stilului browserului, deoarece acceptă doar până la definirea stilului IE6.

9. Filtru de stiluri

Compatibilitate: ferestreCaracteristică notabilă: Etichete CSS

Stylesheet Maker este încă un editor standard CSS care oferă o suprafață de codare curată cu un panou de explorator de fișiere și câteva instrumente utile CSS care ajută la setarea fontului, culorii, marginii, marginii etc..

Comparativ cu mai mulți editori CSS Rapid CSS sau Stil Studio, Maker are o interfață mai mică dar interfață foarte curată, iar acest lucru este bun pentru un anumit începător care nu dorește să facă lucrurile complicate, sau ninja CSS care dorește totul minim și confortabil.

Deși acest editor este conceput pentru utilizator intermediar, caracteristica CSS Tags vă poate ajuta să creați pur și simplu o regulă CSS cu etichete prin clicuri.

Costă 34 de dolari pentru a deține acest editor, sau o puteți cumpăra cu alte programe CoffeeCup ca și cumpărare de pachete.

10. Arduo CSS

Compatibilitate: ferestreCaracteristică notabilă: Nod, CSSTidy

Arduo CSS este un editor CSS nou născut, care are ca scop să vă mulțumească cu interfața sa intuitivă și ușor de utilizat. Cu interfața sa curată și sintaxa de evidențiere, vă sunt garantate pentru a crea și edita un fișier CSS fără prea multă problemă și întrerupere. De asemenea, puteți utiliza funcția "Nod" pentru a defini regulile CSS prin puncte și clicuri.

Pentru cei care vă simt foaia de stil este prea greu, instrumentul CSSTidy din editor vă poate ajuta să optimizați foaia de stil și să ștergeți tot codul inutil.

Editorul este disponibil gratuit pe site-ul său oficial.

11. CSS simplu

Compatibilitate: Windows, Mac OS XCaracteristică notabilă: Import de fișiere CSS, interfață Point-and-click, Bază de date suplimentară

La fel ca numele său, Simple CSS are tot ceea ce un designer are nevoie pentru editare CSS simplu. Puteți importa un fișier CSS în editor și modifica-l cu câteva clicuri, examinați rezultatul în panoul de previzualizare și scoateți imediat codul sursă.

Deși puteți importa aproape orice fișier CSS în editor, puteți vedea o singură regulă CSS la un moment dat cu un clic și uneori importul dvs. ar cauza erori datorită limitării sale ca nici un suport @rules. De asemenea, editorul în sine nu este atât de flexibil ca și cum puteți selecta doar "Auto" sau "Inherit" pentru proprietatea z-index, dar nu da direct proprietății o valoare.

Cu toate acestea, este gratuit și destul de la îndemână pentru designerul care are nevoie de o reparație rapidă.

Bonus: Mai mulți editori și instrumente

În timp ce ei nu sunt exact editori CSS, aceste instrumente sunt ceva ce ar trebui să aveți atunci când este vorba de editare CSS.

Firebug

Cel mai popular și puternic instrument de dezvoltare web care inspectează HTML, modifică stilul CSS și vede schimbările în timp real, disponibile ca plugin pentru browserul web Firefox.

Utilizarea CSS

O extensie pentru Firebug, care vă permite să scanați mai multe pagini ale site-ului dvs. pentru a vedea care sunt regulile CSS utilizate efectiv în site-ul dvs..

Dezvoltator Web

O extensie Firefox pentru tine de a face o mulțime de lucruri cool, cum ar fi vizualizarea surselor CSS sau dezactivarea anumitor stiluri CSS pentru design sau utilizare.

Notepad++

Un editor de cod sursă gratuit și înlocuire cu Notepad care acceptă mai multe limbi, inclusiv CSS. Conține funcții precum Completarea funcțiilor pentru a vă ajuta să vă construiți designul CSS.

Coda

Un editor de text avansat cu editorul CSS încorporat care vă oferă două moduri de editare CSS pentru o experiență de proiectare mai flexibilă, capabil să vadă rezultatul imediat după modificările efectuate.

NetBeans IDE

Un mediu integrat de dezvoltare open source și profesional, cu cea mai completă referință CSS în funcția de completare a codului.

Aptana Studio

Un mediu de dezvoltare web complet care combină instrumente puternice de creație pentru HTML, CSS și JavaScript, acceptă în prezent până la HTML5 și CSS3.

WebStorm

IDE-ul JetBrain care implementează completarea automată relevantă pentru tot ce include CSS, de asemenea puteți primi notificări despre problemele CSS în zbor.