Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Edit HTML from Google Chrome

How can I edit and reflect the changes that I have made in the HTML on Chrome dev tools (press f12 on chrome)?

In source tab we can edit the page but when I click on the save button it does not reflect the changes on the original file.

Is there any way to save these changes?

Here is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>CSS Ribbon</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div id="container">
        <div class="menu">
            <ul>
                <li class="l1">
                    <a href="#">CSS3</a>
                </li>
                <li class="l2">
                    <a href="#">is really</a>
                </li>
                <li class="l3">
                    <a href="#">powerful</a>
                </li>
            </ul>
        </div>

        <div class="bubble">
            <div class="rectangle">
                <h2>3D CSS.................................................................... ...................klklklklk Ribbon</h2>
            </div>
            <div class="triangle-l"></div>
            <div class="triangle-r"></div>
            <div class="info">
                <h2>I Have Used Only CSS, friends!</h2>
                <p>For this tutorial I have used some new properties of the CSS3. You can realize a nice 3D effect using only CSS, it&#39;s really fantastic.<br />
                It doesn&#39;t work with IE!</p>
                <p><a href="http://www.pvmgarage.com/en/2010/01/10/">Go to the tutorial!</a></p>
            </div>
        </div>
    </div>
</body>
</html>
like image 975
Mayur Gupta Avatar asked Apr 23 '26 12:04

Mayur Gupta


1 Answers

The answer is No, You can not save files back on webserver.. It just saves files locally.

Some Points:-

  1. You can do some local modifications like Changing some Styles of some elements, Updating some JavaScript in source tab, Updating some HTML in Elements tab. But these changes will get lost once you reload the page.
  2. If you own the site, you can always copy the final files from dev tools and update your files on web server.

You can always think of the reason why browsers can't do it for you. I shouldn't say it would be a security flaw. Infact it would be security less. This just mean you can update any site which does not belong to you.

I hope you get it.

like image 72
Sachin Avatar answered Apr 25 '26 03:04

Sachin



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!