Introduction to Regular Expressions in Dreamweaver

Searching for CSS Inline Styles

Most web developers know that if a CSS rule is used more than once in a website, best practices recommend replacing instances of that style by a single rule. This approach makes for cleaner code that is easier to manage.

Imagine a scenario where you just started your first day at a new job and you have been asked to clean up all instances of the style attribute within HTML tags throughout a site. For example, look at the following snippet of code:

<div id="footer" style="border-color:red"> 
All styles in the site are protected. 
</div> 

Now imagine that you were to search for the word "style" in the example above. The first result would return the style attribute in the <div> tag. If you were to press the Find Again button, however, a false positive would appear because the instance of "styles" within the <div> tag would be selected.

In order to select only the style in the context of an attribute that defines a CSS style, you must refine your search by defining a regular expression (see Figure 14):

style=\"[A-Za-z0-9:;.-\s(/_)]*"

Figure 14: The Find and Replace dialog box with style=\"[A-Za-z0-9:;.-\s(/_)]*" in the Find text box

Page 8 of 9

Previous Page

Next Page