Remove Unwanted Formatting

Here's an all-too-common scenario:

You are new to Expression Web and are not familiar with how CSS works. As a newbie, you select a paragraph that you want to make look a bit different.


Image 1

You highlight the text in the paragraph so it looks like Image 1 above.


Image 2

Next, you decide to change the font, the font color and the text size. You decide to make it bold and in italics. To do this, you click on the formatting options in the toolbar as shown in Image 2.


Image 3

In Design View, you can see your changes take place instantly. You are happy with your changes. However, you may not be aware of what is going on behind the scenes.


Image 4

If you have the Apply Styles task pane open, you can see that your changes have created three new styles that have been added to the current page.


Image 5

If you are working in Split View, you can see these new styles have been embedded into the head section of your page. You can also see the style coding that has been added to your paragraph.


Image 6

Now imagine that you have gone through the same process to change several paragraphs on the page. You could possibly end up with dozens of extra styles added to your page.

On one hand, this is valid code. Expression Web has done what it was made to do. It has kept old html markup out of your page and has created CSS styles instead.

But what happens when you need to make the text blue instead of red? You will then have to wade through a lot of embedded styles to make your changes. It is also probable that one of your new embedded styles may cause a conflict with one of the existing styles in the external CSS file. Suddenly your page may not display as it should.

Removing Formatting:

Expression Web has some easy ways to remove any unwanted formatting. In the Apply Styles task pane, you will see "Clear Styles".


Image 7

Highlight the paragraph that has embedded styles assigned, and then click Clear Styles. This will remove the style(s) from the paragraph and also from the head of your page. Note that this will only remove the style and not any bold or italics. [<strong> or <emphasis>]

If you wish to remove any additional formatting, highlight the paragraph and go to Format > Remove Formatting. This will remove any formatting that has been added to the html coding.

OK....So how to I made a paragraph with red text, in Comic Sans, and in bold?

Ah, Grasshopper. Learn how to correctly work with new styles in the article "How to Add a Style" in the next lesson.