Editing contents of a webpage in browser

Hi, friends after a long time I have came up with a cool developer post which is useful for every blogger or hacker.I've discovered it and did a research on it and now I'm here to reveal it to you.Most of us uses many browsers to surf the web, and many of us don't now about "Developer Tools" provided in them but they are very often used by web developers or designers and also hackers.

Today I'm gonna explain you how to edit contents of a webpage exclusively..
 First of all we have to select a browser, I use "mozilla firefox" in this b'coz it is most often used by all the developers and has a neat security. Using this browser you are going to edit or changing the elements in "facebook".

It is just for educational purpose only not for changing the original sites contents.

suppose that my facebook page looks like this I can edit it and change it look like another kind of stuff..

 Before

After

This can be done by using developer tools in any browser but you have to know minimum basic topics on html to do this.

I did this now and the steps are:

--> Open the site you wan to edit in a browser "I used Mozilla Firefox" and   select the element you want to change.
 
--> Point on the element you want to edit and click on "inspect element" and new window popups showing the page code.

--> Now head on to the right side box and that was in "CSS" script you can edit it's values and also insert your own values.


--> Do it at your own risk don't edit any password fields or confidential fields, doing that can be risky.....

If any doubts you can comment down here or contact me personally on my contact us page.