Cmlap Hírek, cikkek A css-editor mûködése és használata

A css-editor mûködése és használata

A css-editor.org egy ingyenesen használható wyswyg stíluslap szerkesztõ alkalmazás, immáron kiegészítve css3 kód generáló füllel, melyben csúszkák segítségével állíthatod a színátmeneteket, árnyékolást és a szövegek elforgatását is!
Használatával a böngészõben azonnal látható, hogyan fog az oldalad kinézni, majd az elkészült stíluslapokat és generált képeket letöltheted egy fájlban és használhatod az oldaladon.

Használatához nem szükséges a regisztráció!

  • Elsõ lépésként kattints a CSS Editor menüpontra, majd a beviteli mezõbe írd be az oldalad url-jét és kattints az Edit CSS gombra!

    A szerkesztõ be fogja tölteni az oldaladat ha be tudja olvasni. Egy javascript rá fog ülni és megnézi milyen linkelt stíluslapokat tartalmaz. Ezeket megkapod kiválasztásra egy lenyitható dobozban(select)!

  • Második lépésként válaszd ki melyik CSS fájl kell neked, vagy ha csak egy van, azonnal módosíthatsz is!

    Egy-egy elemre kattintva a zöld doboz felsõ sávjában megjelenik a class vagy id vagy az element neve, ekkor a sáv melletti szerkeszt gomra kattintva(Css rule szerkesztése) megkeresi neked a program a css-edben van-e ilyen vagy ehhez hasonló!

  • Új class-t adhadsz hozzá a hozzáadás gombra kattintva(Css rule hozzáadása, összes listázása), illetve megjelenítheted a definíciókat! A definíció listában a radió gomra kattintva betölti neked a program a kiválasztottat.

    A css kézi szerkesztése gombra kattintva betöltheted a css forrást (Css fájl kézi szerkesztése). Ha ezt lemented, az editor fel fogja dolgozni, ha a mégse gombra kattintasz, visszatölti a kézi módosítás elõtti állapotot.

    Minden módosítást visszavonhatsz a mindent visszavon gombbal, ekkor az eredeti lesz újra feldolgozva, így gondold meg hogy kell-e neked, mert elvész az összes módosításod!



 


Nézd meg a videót arról hogyan használd a css szerkesztõt!


A lementett css fájlokat vagy letöltöd egyben a zip-ben, vagy a kép tallózóból is megnézheted ha rákattintasz.

Amíg a munkameneted él addig elérhetõ minden amit csináltál!

Ha új url-t olvasol be akkor is rátöltõdik az eddigi módosításod, így minden oldalad megformázhatod!


Amikor meg vagy elégedve a dizájnoddal, csak töltsd le a zip-et!

A stíluslapok letöltése után csomagold ki a zip-et és a css fájlokban az url-eket egy  egyszerû keresés/csere módszerrel egy szövegszerkesztõben igazítsd a könyvtárszerkezetedhez.


Rendszer feltételek:

FIGYELEM: jelenleg firefox 6-ban fejlesztem a css3 generátor miatt, így valószínûleg a többi böngészõben nem fog rendesen mûködni, de a generált css kód jó!

A szerkesztõ csak IE8, Firefox ~3, és Google Chrome alatt mûködik rendesen, régebbi böngészõk nem támogatják teljes mértékben a stíluslapok szerkesztését!

A javascriptnek engedélyezve kell lennie.
(Esetleg 7-es Explorer-ben a manuális szerkesztést tudod használni, de egy egy elemet kiválasztani már nem tudsz.)
Prototype-ot és Script.aculo.us-t használ, összeakadás más javascript könyvtárakkal elõfordulhat, habár megpróbáltam ezt kiküszöbölni, de nem garantálom, hogy minden esetben rendben van.

A következõ fejlesztés az lesz, hogy egy oldal html kódját megadhatod, és azon dolgozhatod majd fel a css-eket, de erre még egy kicsit várnod kell!

Ha tetszett vagy hasznosnak talltad, krlek oszd meg!
Author / szerz:
Tovbbi kpek:
Css-editor.org Screenshot 1
css3 kód generáló képernyõfotó
More news in theme / Tovbbi cikkek
Hozzszlsok
Vlasszon nyelvet!
Keress a tartalomban
Kattintson ide az adatok elkldshez!