Główna » zestaw narzędzi » 11 Najlepsi redaktorzy CSS - recenzowani

    11 Najlepsi redaktorzy CSS - recenzowani

    1. Stylizer

    Zgodność: WindowsGodna uwagi cecha: Siatka kodu, uchwyty rozmiaru, dziesiątka, kolorowanie dwoma kliknięciami

    Stylizer to absolutnie unikalny edytor CSS, który skupia się na edycja CSS w czasie rzeczywistym. Możesz po prostu wprowadzić adres internetowy do wbudowanej przeglądarki, która obsługuje definicję stylu Firefox 3.5 i IE7, a wszystkie powiązane reguły CSS zostaną załadowane do edycji za pomocą znanego interfejsu typu wskaż i kliknij.

    Edytor zawiera Siatka kodu funkcja, która sprawia, że ​​edycja CSS jest wygodniejsza, ponieważ możesz zobaczyć wynik natychmiast po zmianie wartości. Również z jego diagnostyką Strzał w dziesiątkę funkcja, możesz zobaczyć powiązane elementy w pewnej części witryny i edytować ją za pomocą punktów i kliknięć. Inne funkcje, takie jak Rozmiar uchwytów pozwala na wizualną regulację położenia elementu CSS i za pomocą Dwukrotne kolorowanie funkcja otrzymujesz próbnik kolorów podobny do Photoshopa, aby wybrać dowolny kolor dla, powiedzmy, czcionki witryny. Och, czy wspomniałem, że wszystkie te zmiany są wykonywane w czasie rzeczywistym, natychmiast widoczny wynik?

    Z Stylizer jest to po prostu niemożliwe, aby popełnić błąd CSS, ponieważ ograniczyłoby to umieszczenie dowolnej wartości, która nie jest zgodna z odpowiednią właściwością CSS. Jednak oprogramowanie czasami nie ładuje pewnych plików CSS z powodu niewyjaśnionego błędu krytycznego.

    Stylizer pochodzi z wersji Basic i Ultimate. Chociaż wersja podstawowa jest całkowicie darmowa, wersja Ultimate jest dostępna przez 14 dni po instalacji, a następnie oferuje 85 USD, aby móc nadal korzystać z jej zaawansowanych funkcji, takich jak Bullseye.

    2. TopStyle

    Zgodność: WindowsGodna uwagi cecha: Inspektor stylów, zamiatarka stylów, CSS Tidy

    Edytor CSS TopStyle zaczyna zaskakiwać swoją konfiguracją po raz pierwszy, kiedy możesz wybrać definicję stylu, która pokazuje tylko właściwości i wartości obsługiwane przez Firefox, Internet Explorer, Safari, a nawet iPhone OS 2.0, co jest praktycznie przydatne na wielu platformach projektant stron internetowych.

    Wśród wszystkich funkcji, które znalazłem Inspektor stylu jest szczególnie przydatny, ponieważ działa jako panel umożliwiający dołączenie dowolnej właściwości CSS za pomocą prostego interfejsu typu wskaż i kliknij. Po zakończeniu wybierania wszystkich żądanych właściwości CSS kod źródłowy zostanie automatycznie wygenerowany, aby zaoszczędzić czas przed powtarzającym się i męczącym kodowaniem.

    Jeszcze jedna dobra rzecz TopStyle czy pokazuje zgodność przeglądarki pod inspektorem stylów, którą można zobaczyć, czy własność CSS jest w pełni obsługiwana przez pewną wersję przeglądarki internetowej, taką jak Internet Explorer 7, czy też jest strasznie wadliwa.

    Edytor jest w wersji próbnej z ograniczoną funkcją, a jego pełny potencjał można odblokować o 79,95 USD.

    3. Style Master

    Zgodność: Windows, Mac OS XGodna uwagi cecha: Szablon arkusza stylów

    Uznany za mistrza, Style Master zrobił całkiem dobrze, tworząc środowisko edycji CSS dla każdego poziomu wiedzy. Oprogramowanie nie tylko zapewnia edytor WYSIWYG, który wygładza przepływ pracy dla początkującego CSS, ale także zapewnia dostęp do bardzo szczegółowych informacji o każdej właściwości CSS, aby ekspert mógł się odwołać. Możesz przeglądać i wybierać właściwości CSS według kategorii lub kolejności alfabetycznej.

    Być może najbardziej unikalnym punktem jest sam edytor zawierający prawie 20 przydatnych szablonów arkuszy stylów, od których można zacząć, i nie dziwi to, że mistrz stylu ma bardzo czyste, uporządkowane i profesjonalne reguły CSS zdefiniowane we wbudowanym szablonie.

    Możesz korzystać z w pełni funkcjonalnego oprogramowania przez 30 dni i zapłacić 59,99 USD lub 29,99 USD za licencję edukacyjną, aby ponownie w pełni wykorzystać swój potencjał.

    4. Zakres Xyle

    Zgodność: ProchowiecGodna uwagi cecha: Tryb wyboru, inteligentna grupa, integracja edytora tekstu

    Xyle Scope to obowiązkowy darmowy edytor CSS dla komputerów Mac, ponieważ jest to naprawdę profesjonalny edytor CSS, który pozwala na surfowanie po stronie, a jednocześnie dostrojenie jej CSS bezpośrednio w edytorze.

    Przeglądarka Xyle jest wyposażony w normalny tryb przeglądarki i tryb wyboru, który działa podobnie jak wtyczka Firefox, Firebug, który zapewnia przeglądanie i edycję źródła CSS, z wyjątkiem tego, że edytor pozwala na zapisanie zmodyfikowanych wartości CSS w ich oryginalnej lokalizacji.

    Używając 'Inteligentna grupa„Funkcja, możesz odfiltrować wszystkie reguły wpływające na sposób wyświetlania linków lub osoby odpowiedzialne za układ, możesz nawet zawęzić wynik dzięki wbudowanej funkcji wyszukiwania, bez metody prób i błędów!

    Zakres Xyle oferuje także integrację z zewnętrznymi edytorami tekstu, takimi jak BBEdit, w celu wygodniejszego i energooszczędnego kodowania, wystarczy zmienić, a edytor tekstu lub Xyle Scope automatycznie zaktualizuje wszystkie zmiany dla Ciebie.

    5. Szybki CSS

    Zgodność: WindowsGodna uwagi cecha: Składnia Highlighter, Code Completion, CSS Formatting

    Rapid CSS to sposób na wygodniejszą, wygodniejszą i bardziej złożoną edycję CSS. Posiada własny, w pełni konfigurowalny edytor tekstu z przydatnymi funkcjami, takimi jak podświetlanie składni, uzupełnianie kodu i wbudowane odwołanie CSS do bezbolesnego kodowania.

    Dbając o czystość twojego CSS, możesz sformatować arkusz stylów CSS, zmienić ich układ według typu CSS lub utworzyć stenograficzne właściwości, aby arkusz wyglądał bardziej komfortowo i słodko. Wbudowany weryfikator kodu zapewnia również, że arkusz stylów jest nie tylko czysty, ale i ważny.

    Edytor jest wyposażony w 30-dniowy okres próbny z 30 zastosowaniami, możesz przejść do pełnej wersji o 29,85 USD.

    6. Studio stylów

    Zgodność: WindowsGodna uwagi cecha: Kreator CSS, IntelliStyle

    Główne piękno Style Studio leży w jego funkcji CSS Wizard, która zapewnia natychmiastowy efekt CSS za pomocą kilku punktów i kliknięć.

    Na przykład możesz wybrać kreator czcionek, a następnie wybrać rodzinę czcionek i ustawić dla niej rozmiar czcionki, a następnie styl czcionki, wagę, wariant… i wysięgnik! Reguły są wstawiane do arkusza stylów jako w pełni sprawdzony kod CSS.

    Funkcja kreatora obejmuje również reguły koloru, obramowania, tekstu, pozycjonowania, klasyfikacji i wreszcie filtrowania, prawie wszystko, co możesz myśleć o CSS. Te kreatory są bardzo użyteczne, ponieważ nie musisz wpisywać ich wielokrotnie, aby uzyskać pewien skomplikowany efekt CSS. Inną szlachetną cechą jest IntelliStyle, która działa jak uzupełnianie kodu, abyś mógł wybrać pewne właściwości CSS dla swojego projektu.

    Wadą tego edytora byłaby przestarzała obsługa definicji stylu przeglądarki, ponieważ obsługuje ona tylko IE6 i, no, nie Firefox.

    Masz 30 dni na korzystanie z oprogramowania i 49,99 USD na zakup.

    7. CSSEdit

    Zgodność: ProchowiecGodna uwagi cecha: X-ray Inspector, Visual Editor, Selector Builder

    Zaprojektuj piękne, innowacyjne i szybko ładujące się witryny dzięki pięknej, innowacyjnej i szybkiej aplikacji, czyli CSSEdit by MacRabbit. Od funkcji takich jak Selector Builder po inteligentne środowisko źródłowe, CSSEdit jest zaprojektowany dla każdego poziomu wiedzy.

    Z tak dopracowanym edytorem, jak ten, oczekuje się, że zmiany w arkuszu stylów CSS pojawią się w czasie rzeczywistym, bez męczącej akcji przesyłania i odświeżania. Inspektor rentgenowski jest również tworzony jako funkcja do diagnozowania kodu CSS z określonej części witryny.

    Innowacyjna część CSSEdit jest prawdopodobnie jego Kreator wyboru dzięki temu możesz opisać swój styl CSS prostym angielskim, nie interesującym dla eksperta, ale przydatnym dla początkującego.

    Wersja demonstracyjna ogranicza zapisywanie pliku z mniej niż 2500 znaków, podczas gdy możesz zapłacić 39,95 $, aby usunąć wszystkie ograniczenia.

    8. Edytor CSS EngInSite

    Zgodność: WindowsGodna uwagi cecha: Narzędzie pomiarowe w trybie podglądu

    Jeśli jesteś poważnym projektantem, który troszczy się o poprawną specyfikację CSS, właściwe umieszczenie CSS lub arkusz stylów CSS musi być w pełni zweryfikowany, edytor CSS EngInSite może być Twoim ulubionym edytorem.

    W tym edytorze możesz dodawać selektor klasy, identyfikatora i elementu za pomocą wbudowanego inspektora, możesz także przekonwertować kolor na wartość Hex lub RGB, co jest bardzo rzadką cechą edytora CSS. Możesz obserwować swój wynik w panelu podglądu za pomocą narzędzi pomiarowych, aby upewnić się, że każdy element projektu jest we właściwej pozycji.

    Edytor zawiera również uzupełnienie kodu, ale jest trochę błędny, więc powiedziałbym, że jest kompletny. W przeciwnym razie cały edytor jest fajny w użyciu, poza faktem, że edytor jest dość przestarzały pod względem obsługi stylu defnition przeglądarki, ponieważ obsługuje tylko definicję stylu IE6.

    9. Kreator arkuszy stylów

    Zgodność: WindowsGodna uwagi cecha: Tagi CSS

    Stylesheet Maker jest kolejnym standardowym edytorem CSS, który oferuje czystą powierzchnię kodowania z panelem eksploratora plików i kilkoma użytecznymi narzędziami CSS do ustawiania czcionki, koloru, marginesu, obramowania itp..

    W porównaniu do kilku edytorów CSS Szybki CSS lub Styl Studio, Maker ma mniej funkcjonalny, ale bardzo czysty interfejs, a to jest dobre dla niektórych początkujących, którzy nie chcą komplikować spraw, lub ninja CSS, który chce wszystkiego, co minimalne i wygodne.

    Chociaż ten edytor jest przeznaczony dla pośrednich użytkowników, jego funkcja znaczników CSS może pomóc w utworzeniu reguły CSS ze znacznikami za pomocą kliknięć.

    Posiadanie tego edytora kosztuje 34 USD lub można go kupić wraz z innym oprogramowaniem CoffeeCup jako pakiet.

    10. Arduo CSS

    Zgodność: WindowsGodna uwagi cecha: Węzeł, CSSTidy

    Arduo CSS to nowatorski edytor CSS, który ma na celu zadowolenie użytkownika dzięki intuicyjnemu i łatwemu w obsłudze interfejsowi. Dzięki czystemu interfejsowi i podświetlaniu składni masz gwarancję tworzenia i edycji pliku CSS bez większych problemów i przerw. Możesz także użyć funkcji „Węzeł”, aby zdefiniować reguły CSS według punktów i kliknięć.

    Dla tych, którzy uważają, że Twój arkusz stylów jest zbyt ciężki, narzędzie CSSTidy z edytora może pomóc zoptymalizować arkusz stylów i usunąć cały zbędny kod.

    Edytor jest dostępny bezpłatnie na oficjalnej stronie.

    11. Prosty CSS

    Zgodność: Windows, Mac OS XGodna uwagi cecha: Import plików CSS, interfejs wskaż i kliknij, dodatkowa baza czcionek

    Podobnie jak jego nazwa, Simple CSS zawiera wszystko, czego projektant potrzebuje do prostej edycji CSS. Możesz zaimportować plik CSS do edytora i zmodyfikować go za pomocą kilku kliknięć, sprawdzić wynik w panelu podglądu i natychmiast pobrać kod źródłowy.

    Chociaż możesz zaimportować prawie każdy plik CSS do edytora, możesz wyświetlić tylko jedną regułę CSS za jednym kliknięciem, a czasami import spowoduje błąd z powodu jego ograniczeń, takich jak brak obsługi @rules. Również sam edytor nie jest tak elastyczny, jak tylko możesz wybrać „Auto” lub „Dziedzicz” dla właściwości z-index, ale nie bezpośrednio nadaj właściwości tej wartości.

    Niemniej jednak jest darmowy i bardzo przydatny dla projektanta, który potrzebuje szybkiej naprawy.

    Bonus: więcej edytorów i narzędzi

    Chociaż nie są to dokładnie edytory CSS, poniższe narzędzia są czymś, co warto mieć przy edycji CSS.

    Firebug

    Najbardziej popularne i wydajne narzędzie do tworzenia stron internetowych, które sprawdza HTML, modyfikuje styl CSS i widzi zmiany w czasie rzeczywistym, dostępne jako wtyczka do przeglądarki Firefox.

    Wykorzystanie CSS

    Rozszerzenie do Firebug, które umożliwia skanowanie wielu stron witryny, aby sprawdzić, które reguły CSS są rzeczywiście używane w witrynie.

    Twórca stron internetowych

    Rozszerzenie Firefoksa, dzięki któremu możesz robić wiele fajnych rzeczy, takich jak przeglądanie źródeł CSS lub wyłączanie niektórych arkuszy stylów CSS do wykorzystania w projektowaniu lub programowaniu.

    Notatnik++

    Darmowy edytor kodu źródłowego i zamiennik Notatnika obsługujący kilka języków, w tym CSS. Zawiera funkcje, takie jak uzupełnianie funkcji, które pomagają w tworzeniu projektu CSS.

    Coda

    Zaawansowany edytor tekstu z wbudowanym edytorem CSS, który zapewnia dwa tryby edycji CSS, co zapewnia bardziej elastyczne wrażenia projektowe, umożliwiając natychmiastowy podgląd wyników.

    NetBeans IDE

    Otwarte i profesjonalne zintegrowane środowisko programistyczne z najbardziej kompletnym odwołaniem do CSS w funkcji uzupełniania kodu.

    Aptana Studio

    Kompletne środowisko programistyczne, które łączy zaawansowane narzędzia do tworzenia kodu HTML, CSS i JavaScript, obecnie obsługuje HTML5 i CSS3.

    WebStorm

    IDE JetBrain'a, które implementuje odpowiednie automatyczne uzupełnianie wszystkiego, w tym CSS, również możesz otrzymywać powiadomienia o problemach CSS w locie.