Use Firebug to get a deep copy of CSS in elements

问题

I am using Firebug to inspect the elements of a webpage. On the right hand of the page there is a "style" tab that list all the CSS styling for a given tag. These CSS styling are coming from a linked CSS page.

What I am looking to do is somehow copy a set of divs with the CSS hardcoded in the div. This way I can copy and paste the elements and have the exact same styling. Is this possible to do with Firebug or perhaps another tool?

回答1:

I don't know about Firebug, but you could build a script to do it.

List the CSS you want to copy (every property you believe is required to make it portable) and then loop through in JS and getComputedStyle(). Then build a ; delimited list of property:value pairs, and assign it to the style attribute if your element and all children.

This doesn't look like an easy task - and you will no doubt run into problems.

回答2:

I used IE9 to accomplish this.

Open a page where you want to grab a style in IE9
Press F12 to display Developer Toolbar
In the Developer Toolbar press Find and select "Select element by click"
Then go to "View" > "Source" and select "Element source with style"

回答3:

I'm not sure what exactly you're trying to do here but are you trying to apply the same style to multiple elements (divs)? If so you should use a css class. So your html will be

<div class="myClass"></div>
<div class="myClass"></div>
<div class="myClass"></div>

and css will be

.myClass
{
height:whatever;
width:whatever;
etc
}

来源：https://stackoverflow.com/questions/4180992/use-firebug-to-get-a-deep-copy-of-css-in-elements

标签

css

firebug