As powerful as Firebug is for inserting HTML and CSS on the fly, sometimes you just want to save a local version of the page so that HTML manipulation can be saved and tested across browsers.
Yuck, it’s missing styles. That’s not what we wanted.
But by inserting a little code in
head, we can grab everything the page uses from the site. After the opening
head tag, insert the following:
<base href="http://www.wired.com/" />
and then resave the file. View the result, and you should see the page just as it is meant to be seen at its original address.
I can modify my local copy to my heart’s content, putting new or modified CSS in
style tags until I have it just right, then commit the changes to something more permanent. I use this all the time when troubleshooting defects, especially when needing to see how inserting some new element in the HTML will affect IE. Hopefully, it will help some of you, too.
And note that the wired.com example might work for today, but if they ever redesign, this article’s example won’t mean jack. I apologize in advance.