Edycja kodu źródłowego HTML za pomocą Google Chrome

Ctrl+Shift+I or F12 -> Elementy, To powinno pokazać twoje źródło. Kliknij prawym przyciskiem myszy na dowolny element i kliknij Edit as HTML

Edit:

Istnieją pewne rozszerzenia, które wyglądają tak, jak chcesz: https://chrome.google.com/extensions/search?itemlang=&q=editor

ChromeEditor Live WebSite Editor <HTML..> or </HTML> wyglądają obiecująco.

Dodane przez barlop widzę, że (po ctrl-shift-I / F12), kliknięcie prawym przyciskiem myszy na tag &007 i kliknięcie “edit as html” pozwala mi edytować w dowolnym miejscu wewnątrz niego. Wybranie znacznika otwierającego oznacza, że wyskakujące okienko do edycji obejmuje po prostu całe źródło html, które tam jest - co jest bardzo schludne pod względem przestrzeni podczas edycji. Wybór znacznika zamykającego może być użyteczny, ponieważ wyskakujące okienko pojawia się pod html, więc widzisz przed/po. Albo lepiej, jak mówi benjamin, F2 do edycji, ctrl-enter do zaangażowania.

1. open DevTools.
2. open Elements panel.
3. select html lub body or another element you want.
4. open console by Esc.
5. write $0.contentEditable = true

now you can edit text on the page and move images but it is not that you really want :)

Jeśli chcesz edytować plik jako źródło html (a nie poszczególne elementy) możesz wykonać następujące czynności:

1. wybrać zakładkę “Źródła” po lewej stronie
2. kliknąć prawym przyciskiem myszy w okienku “Źródła” i wybrać “Dodaj folder do obszaru roboczego” i dodać folder ze źródłowym plikiem HTML
3. kliknąć prawym przyciskiem myszy plik html, który chcesz edytować i wybrać “mapę do zasobów sieciowych”.

Możesz spróbować tego InlineEditor do edycji i zapisywania statycznej html na stronach przeglądarki tutaj jest demo