Moving Internal Styles to External

There are a number of reasons why your pages might have internal styles instead of using an external style sheet: possibly they're from an older site (when that was more common), or possibly you used internal styles to test your layout. But now your internal style sheet is ready to live on its own, so your styles need to come out of your Web page and into a stand-alone file.

To export styles:

1.	With the Web page open that contains the styles you want to export, choose File > Export > CSS Styles ( Figure 5.66 ). The Export Styles As CSS File dialog appears ( Figure 5.67 ). Figure 5.66. You can export the CSS styles out of a Web page and into an external file. Figure 5.67. Here's where you name that external CSS file.
2.	You should be prompted with the correct place to save your file. Come up with a good name (ending in .css ) and click Save.
3.	Follow the directions given earlier in this chapter in "Attaching a Style Sheet" and use link or import to attach the new style sheet file to your current Web page. Look in the CSS Styles panel, and you should notice that all your styles are now duplicated ( Figure 5.68 )don't fret, that's what should happen. Figure 5.68. When your styles are exported and then attached, you'll have two of every rule.
4.	Select the <style> line in the panel, and click the Delete Embedded Stylesheet icon at the bottom of the panel ( Figure 5.69 ). This removes the internal styles from your Web page. Figure 5.69. You can then delete the internal styles, leaving only the external.

Tips

• If you're not seeing duplicates in Step 3, make sure that you're in All (Document) Mode and that both sets of rules have been expanded.

• If you're the careful type, use the "Show only set properties" button to see rules for each style, and then compare each internal style against the external style before deleting the internal style.