Widziałem jsFiddle, ale nie tego tu szukam. Szukam czegoś, co ma fałszywą stronę, pełną typowego kodu HTML, której mogę użyć, aby zobaczyć, jak wyglądałby mój css. Na colorschemedesigner.com możesz po prostu kliknąć „Przykład jasnej strony”, aby wyświetlić stronę Lipsum.
Homer
Widzę. lol Myślę, że to było to, czego szukałem, kiedy natknąłem się na twoje pytanie, więc kiedy je znalazłem ... starałem się poszukać twojego pytania w mojej historii i opublikowałem je tutaj. Mam nadzieję, że to pomoże komuś ....
To nie wydaje się być odpowiedzią na twoje pytanie.
jeremy,
2
Nie znam żadnego z nich, ale sam możesz to łatwo skonfigurować. Po prostu utwórz podstawowy dokument HTML ze wszystkimi opisanymi elementami. (W razie potrzeby możesz wygenerować tekst z Lipsum.com .) Następnie połącz z plikiem CSS w nagłówku dokumentu, aby zobaczyć dołączone style. Następnym razem, gdy chcesz przetestować, zmień go, aby wskazywał na inny plik CSS.
Nie jest to dokładnie to, co prosiłeś, ale kocham tryb oglądania na żywo z less.js .
Ogólnie po prostu wykonuję makiety dowolnych elementów / kombinacji w dowolnym formacie HTML lub XHTML, który jest wymagany ręcznie, ale możesz stworzyć własny główny dokument elementów. Jeśli podłączysz drugi monitor (lub dwa, trzy itp.), Aby otworzyć wszystkie przeglądarki (lub użyj drugiego komputera), wszystkie zapisane zmiany zostaną zastosowane na żywo na wszystkich z nich jednocześnie.
Składni LessCSS można używać razem ze zwykłym CSS, ale jest szybszy w pracy i łatwy do odczytania (wyniki można później przekonwertować na normalny CSS).
Narzędzia takie jak Aviary umożliwiają łatwe robienie zrzutów ekranu (w tym automatyzację przewijania w dół i zszywania), które można szybko opisać (on-line z udostępnianymi linkami) lub zapisać i porównać w innym narzędziu (takim jak Photoshop , GIMP , Paint .NET itp.), Nakładając je jako warstwy i zmieniając przezroczystość tego na wierzchu.
Edytować:
Jeśli chcesz zautomatyzować proces zrzutu ekranu (podczas zapisywania pliku), aby:
gdy pojawia się problem, masz już wszystko pod ręką
obraz można dodać do kontroli wersji (który również może zostać zautomatyzowany przy zapisywaniu pliku)
możesz skoncentrować się na CSS zamiast działań peryferyjnych
wtedy możesz użyć czegoś takiego jak obserwator plików (przepraszam za orientację w Pythonie, istnieje wiele innych rozwiązań) z chwytaczem ekranu . Przetwarzanie końcowe można również zautomatyzować, a jeśli używasz spójnych pozycji okna (może to pomóc środowisko programu / pulpitu), „chrome” wokół przeglądarek można odciąć jako część skryptu.
w3schools pozwala bawić się regułami HTML i CSS. Po prostu znajdź CSS / HTML, z którym chcesz grać, i poszukaj tam, gdzie jest napisane: „Wypróbuj sam”. Oto ich border CSSstrona, a tu ich plac zabaw .
Wszystkie strony buduję w html / css, a następnie używam firebug lub chrome webmaster tools do dodawania / zmiany / eksperymentowania ze stylami. Jest szybki, prosty i tymczasowy, co świetnie nadaje się do eksperymentowania. Ponadto możesz pracować z własnym kodem na własnych serwerach, co jest kolejną zaletą.
Buzzkill: część mnie, twórcy interfejsu użytkownika, ostrzega cię, że lepiej jest tworzyć koncepcje w prawdziwym narzędziu do projektowania, a następnie kodować naśladować z powodu różnic w przeglądarkach ... po prostu mówiąc ...
Uwaga dodatkowa - Jestem wielkim fanem UI Themeroller firmy Jquery. Takie narzędzie istnieje, aby Themeroller mógł zmieniać style z boku. Możliwe jest pełne motywowanie strony za pomocą CSS Themerollera, a następnie przełączanie między różnymi motywami. Jeśli jeszcze go nie wypróbowałeś, może naprawdę przyspieszyć wdrożenie, szczególnie jeśli szukasz tak „błyszczącego” wyglądu, który jest teraz tak popularny.
Całkiem fajnie, ale nie do końca to, co miałem na myśli. Ta strona generuje html pasujący do css. To miłe, ponieważ pokazuje wszystkie twoje style w akcji, ale nie pokazuje, jak wyglądałby na „fałszywej” stronie. Coś takiego można zobaczyć na colorschemedesigner.com po kliknięciu linku „Przykład jasnej strony”
Homer,
0
Nie jestem pewien, czy o to prosiłeś, ale Zen Garden CSS ma taką stronę HTML z mnóstwem projektów CSS. Możesz napisać własny CSS dla tej strony, przykłady są bardzo inspirujące.
Odpowiedzi:
Wow, ktoś właśnie opublikował to na SO.
To jest właśnie to, co zamówił lekarz: http://jsfiddle.net/
Możesz pisać html, css i javascript i uruchamiać go tam !! Dodatkowo mają już odniesienia do Jquery i innych rzeczy!
Myślę, że Zasada 33 Internetu jest taka, że jeśli chcesz / możesz to sobie wyobrazić! ;)
źródło
Właśnie natknąłem się na http://colorschemedesigner.com/ .
Świetnie nadaje się do wybierania kolorów i pokazuje przykładowe strony, aby zobaczyć, jak schemat kolorów wyglądałby na typowej stronie.
Aktualizacja: strona jest teraz http://paletton.com
źródło
Nie znam żadnego z nich, ale sam możesz to łatwo skonfigurować. Po prostu utwórz podstawowy dokument HTML ze wszystkimi opisanymi elementami. (W razie potrzeby możesz wygenerować tekst z Lipsum.com .) Następnie połącz z plikiem CSS w nagłówku dokumentu, aby zobaczyć dołączone style. Następnym razem, gdy chcesz przetestować, zmień go, aby wskazywał na inny plik CSS.
źródło
Nie jest to dokładnie to, co prosiłeś, ale kocham tryb oglądania na żywo z less.js .
Ogólnie po prostu wykonuję makiety dowolnych elementów / kombinacji w dowolnym formacie HTML lub XHTML, który jest wymagany ręcznie, ale możesz stworzyć własny główny dokument elementów. Jeśli podłączysz drugi monitor (lub dwa, trzy itp.), Aby otworzyć wszystkie przeglądarki (lub użyj drugiego komputera), wszystkie zapisane zmiany zostaną zastosowane na żywo na wszystkich z nich jednocześnie.
Składni LessCSS można używać razem ze zwykłym CSS, ale jest szybszy w pracy i łatwy do odczytania (wyniki można później przekonwertować na normalny CSS).
Narzędzia takie jak Aviary umożliwiają łatwe robienie zrzutów ekranu (w tym automatyzację przewijania w dół i zszywania), które można szybko opisać (on-line z udostępnianymi linkami) lub zapisać i porównać w innym narzędziu (takim jak Photoshop , GIMP , Paint .NET itp.), Nakładając je jako warstwy i zmieniając przezroczystość tego na wierzchu.
Edytować:
Jeśli chcesz zautomatyzować proces zrzutu ekranu (podczas zapisywania pliku), aby:
wtedy możesz użyć czegoś takiego jak obserwator plików (przepraszam za orientację w Pythonie, istnieje wiele innych rozwiązań) z chwytaczem ekranu . Przetwarzanie końcowe można również zautomatyzować, a jeśli używasz spójnych pozycji okna (może to pomóc środowisko programu / pulpitu), „chrome” wokół przeglądarek można odciąć jako część skryptu.
źródło
w3schools pozwala bawić się regułami HTML i CSS. Po prostu znajdź CSS / HTML, z którym chcesz grać, i poszukaj tam, gdzie jest napisane: „Wypróbuj sam”. Oto ich
border CSSstrona, a tu ich plac zabaw .źródło
Wszystkie strony buduję w html / css, a następnie używam firebug lub chrome webmaster tools do dodawania / zmiany / eksperymentowania ze stylami. Jest szybki, prosty i tymczasowy, co świetnie nadaje się do eksperymentowania. Ponadto możesz pracować z własnym kodem na własnych serwerach, co jest kolejną zaletą.
Buzzkill: część mnie, twórcy interfejsu użytkownika, ostrzega cię, że lepiej jest tworzyć koncepcje w prawdziwym narzędziu do projektowania, a następnie kodować naśladować z powodu różnic w przeglądarkach ... po prostu mówiąc ...
Uwaga dodatkowa - Jestem wielkim fanem UI Themeroller firmy Jquery. Takie narzędzie istnieje, aby Themeroller mógł zmieniać style z boku. Możliwe jest pełne motywowanie strony za pomocą CSS Themerollera, a następnie przełączanie między różnymi motywami. Jeśli jeszcze go nie wypróbowałeś, może naprawdę przyspieszyć wdrożenie, szczególnie jeśli szukasz tak „błyszczącego” wyglądu, który jest teraz tak popularny.
źródło
Proszę bardzo: http://www.oswt.co.uk/developments/style_sheet_viewer/
Dokładnie to, co jest wymagane w pytaniu!
źródło
Nie jestem pewien, czy o to prosiłeś, ale Zen Garden CSS ma taką stronę HTML z mnóstwem projektów CSS. Możesz napisać własny CSS dla tej strony, przykłady są bardzo inspirujące.
źródło