Can we permanently fixed HTML page and cannot edit again?

i want that no one can edit or change my html file especially on browser ???

Try new tips & tricks and get more knowledge about web-development and website design..

want to know more ab HTML , CSS , JAVASCRIPT , PHP , C# , SQL , PYTHON....

If you want a quick solution that stops your friends from changing the site's HTML by inspecting the page, you can use a MutationObserver.

The following example shows how you can detect when the page's HTML has been updated:

window.addEventListener('load', function() {
  const observer = new MutationObserver(function() {
    console.log('stop');
  })

  observer.observe(document.body, {
    characterData: true,
    childList: true,
    attributes: false,
    subtree: true
  });
})

<h2>Open Dev Tools and Edit</h2>
<p>Lists can be nested (list inside list):</p>

<ul>
  <li>Coffee</li>
  <li>Tea
    <ul>
      <li>Black tea</li>
      <li>Green tea</li>
    </ul>
  </li>
  <li>Milk</li>
</ul>

If you want to revert the change when the HTML is updated, a dirty solution would be to store the body's innerHTML on load, then replace on change.

This is mostly a for-fun thing though - don't use this on a real site, since completely overwriting innerHTML will break your site. This is because you are essentially destroying every element and recreating it, causing previously bound event listeners to be lost.

window.addEventListener('load', function() {
  const startHTML = document.body.innerHTML;
  const observer = new MutationObserver(function() {
    if(document.body.innerHTML != startHTML){
      alert('nice try bro');
      document.body.innerHTML = startHTML;
    }
  })

  observer.observe(document.body, {
    characterData: true,
    childList: true,
    attributes: false,
    subtree: true
  });
})

<h2>Open Dev Tools and Edit</h2>
<p>Lists can be nested (list inside list):</p>

<ul>
  <li>Coffee</li>
  <li>Tea
    <ul>
      <li>Black tea</li>
      <li>Green tea</li>
    </ul>
  </li>
  <li>Milk</li>
</ul>