darmowy edytor kodu HTML online z natychmiastowym podglądem na żywo. Wprowadź kod w edytorze i zobacz, jak podgląd zmienia się podczas pisania. Komponuj swoje dokumenty łatwo bez instalowania żadnego programu.
istnieje inny edytor HTML online, który używa edytora wizualnego WYSIWYG połączonego z edytorem źródłowym, ale uznaliśmy, że konieczne jest utworzenie oddzielnego kompozytora, w którym TinyMCE nie nadpisuje błędów i daje większą swobodę i kontrolę., Ten konkretny edytor koryguje nasz kod za każdym razem, gdy uzna coś za błąd, nawet jeśli tego nie chcemy. Teraz możemy używać niestandardowych znaczników i atrybutów, ASP.NET tagi i nie tylko.
Jak korzystać z edytora kodu HTML?
po pierwszym załadowaniu strony zobaczysz edytor źródeł z tekstem demonstracyjnym, co pozwoli Ci eksperymentować z narzędziem. Załaduj ten tekst w dowolnym momencie, korzystając z opcji przydzielonego menu. Aby otworzyć nowy znacznik, Użyj listy powyżej obszaru tekstowego. Zamknij otwarte znaczniki klikając przycisk Zamknij po prawej stronie górnej sekcji., Spowoduje to zamknięcie Pozycji jeden po drugim w odwrotnej kolejności otwierania.
główny obszar komponowania HTML wykorzystuje podświetlanie składni, aby znaczniki języka znaczników były łatwo rozpoznawalne i czytelne. Ilość znaków jest wyświetlana wraz z głównymi przyciskami sterującymi: Cofnij, nowa strona, regulator rozmiaru czcionki, kompresor i główny przycisk czyszczenia HTML, który wykonuje wszystkie sprawdzone opcje czyszczenia.
obszar podglądu znajduje się po prawej stronie edytora źródeł, a zmiany są tu natychmiast odzwierciedlane, aby komponowanie HTML było bardziej przyjazne dla człowieka., Ta sekcja korzysta z Bootstrap CSS, który pozwala na użycie stylów najpopularniejszego frameworka front-end.
przewijając dalej w dół można znaleźć wiele przydatnych zintegrowanych narzędzi. Użyj kreatora znaczników, aby wykonać operacje zbiorcze na kodzie. Po pierwszej kolumnie listy nazw znaczników znajdują się dodatkowe opcje tworzenia nowych znaczników, zastępowania ich, usuwania ich całkowicie z ich zawartością, usuwania tylko znaczników, usuwania atrybutów znaczników niektórych znaczników i konwersji tabel i list na strukturalne elementy div., Oprócz predefiniowanych znaczników iframe, table, link, span, image, form I list można definiować i manipulować kolejnymi znacznikami wprowadzającymi je w polach wprowadzania. Każda akcja kreatora znaczników może być wykonywana indywidualnie za pomocą przycisków Little play lub można je aktywować sprawdzając szare kropki i zastosować je wszystkie razem z głównym przyciskiem w prawym górnym rogu okna.
najbardziej podstawowe funkcje czyszczenia HTML są dostępne i mogą być stosowane pojedynczo lub wszystkie aktywne opcje w tym samym czasie., Wyczyść style inline, niechciane klasy i identyfikatory, puste znaczniki, znaczniki zawierające tylko jedną niełamliwą spację, kolejne spacje, komentarze. Możesz także pozbyć się wszystkich atrybutów tagów (z wyjątkiem src obrazów i href tagów kotwicy) lub usunąć wszystkie tagi jednym kliknięciem myszy, czyniąc dokument zwykłym tekstem.
narzędzie zastąp może przeglądać i wymieniać bity tekstu w całym dokumencie, zawartości, atrybutach znaczników, stylach lub klasach / identyfikatorach. Nie obsługuje wyrażeń regularnych.,
próbnik kolorów jest kolejną ważną cechą edytora kodu HTML, która pozwala nam łatwo wybrać żądany kolor i zapisać je do późniejszego użycia. Najczęstsze fragmenty kodu można łatwo skopiować i wkleić w edytorze.
generator tekstu bełkot zapełnia edytor lub przydzielony obszar na stronie kilkoma podstawowymi akapitami Lorem Ipsum.
przydatne wskazówki
zachowaj kopię zapasową zawartości i zawsze Zapisz postęp pracy.
upewnij się, że walidujesz kod HTML przed publikacją, aby uniknąć błędów.
przeczytaj o wszystkich złych praktykach HTML tutaj.,
użyj poniższego CSS do stylizacji div konwertowanych z tabel: