Modifier le code source HTML avec Google Chrome

Ctrl+Shift+I or F12 -> Éléments, il devrait indiquer votre source. Faites un clic droit sur n'importe quel élément et cliquez sur Edit as HTML

Edit:

Il y a quelques extensions qui ressemblent à ce que vous voulez : https://chrome.google.com/extensions/search?itemlang=&q=editor

ChromeEditor Live WebSite Editor semblent prometteurs.

Ajouté par barlop Je vois que (après ctrl-shift-I / F12), un clic droit sur la balise <HTML..> or </HTML> et un clic sur “edit as html”. me permet d'éditer n'importe où à l'intérieur. Le choix de la balise d'ouverture signifie que la fenêtre d'édition ne couvre que la source html qui se trouve là - ce qui est très bien en termes d'espace lors de l'édition. Le choix de la balise de fermeture peut être utile car le popup apparaît alors sous le html, ce qui permet de voir un avant/après. Ou mieux, comme le dit Benjamin, F2 pour éditer, ctrl-enter pour valider.

1. ouvrir DevTools.
2. ouvrir le panneau des éléments.
3. sélectionner html ou body ou un autre élément que vous voulez.
4. ouvrir la console par Esc.
5. écrire $0.contentEditable = true

maintenant vous pouvez éditer du texte sur la page et déplacer des images mais ce n'est pas que vous voulez vraiment :)

Si vous voulez éditer le fichier en tant que source html (et non des éléments individuels), vous pouvez procéder comme suit :

1. sélectionnez l'onglet “Sources” sur le côté gauche
2. faites un clic droit dans le panneau “Sources” et sélectionnez “Ajouter un dossier à l'espace de travail” et ajoutez le dossier avec le fichier HTML source
3. faites un clic droit sur le fichier html que vous voulez éditer et sélectionnez “map to network resource”.

Vous pouvez essayer cet InlineEditor pour éditer et sauvegarder le html statique dans les pages du navigateur ; voici la démo