6. Working with Text Using CSS Styles and HTML: Lesson 2, Exercise 9 Internal styles stored in the Head section of the page Define formats for new style The CSS Styles panel displays style properties
7.
8. Working with Text Using CSS Styles and HTML: Lesson 2, Exercise 11 Alignment controls Ordered list Unordered list Indent Outdent
9.
10.
11.
Hinweis der Redaktion
If the Office document is not already stored in the site folder along with the other site files, Dreamweaver will let you know and ask whether you want the program to copy the file there. Word HTML pages may contain coding that is not necessary in Dreamweaver, making the files larger than necessary. To strip out unnecessary codes, use the Commands > Clean Up Word HTML menu command.
Use the options in this dialog box as follows: Text only pastes the copied material as basic text. Excel data pastes as a block of text without any tabular organization. Text with structure pastes the copied material with its basic paragraph or spreadsheet structure in place. Text with structure plus basic formatting pastes the copied material with structure plus any bold or italic formatting that has been applied. Text with structure plus full formatting pastes the copied material with structure and all applied formatting, such as font color or cell fill color.
Use the Commands > Check Spelling command to launch the spelling checker. If the spelling checker finds spelling errors on the page, it lists alternatives you can choose to correct spelling. Choose Edit > Find and Replace to locate and change text and tags on the current page or throughout your site. For example, you could use Find and Replace to change all occurrences of a product name on your site. When used to find and replace text, this feature works much the same way as it does in a word processing program.
There are several advantages to creating and using styles and style sheets: Working with styles is efficient: You can create style rules once and use them many times on a page or throughout a Web site. If you need to edit a style, you can change it in one location and the change is made throughout the site. Styles give you more formatting options than HTML: Using styles, you can easily apply borders to any side of a paragraph, position images or blocks of content absolutely, specify space between lines of text, and apply other options that cannot be achieved with standard HTML coding. Styles are not as code-intensive as HTML: Styles take up less room in a document’s code than HTML, which means the page’s file size is smaller and it will often load more quickly. This is especially true for tags such as <font>, which require a number of attributes and values each time a designer wants to adjust text appearance on a page.
You will use the options in the Type category most often when creating new text formats. You can select the desired font, size, style, weight, and color, as well as “decorations” such as underlines or a blink feature. Note that you can also specify line height to add space between lines that can give text a less crowded look. Use the Background category to set a background color or image for the style. If you select a background image, you can tile it on the page using the Repeat option in the Repeat list. Use the Block category to set vertical and horizontal alignment options. You can also create indents in this category. The Box, Border, List, Positioning, and Extensions categories offer additional settings to fine-tune the style: create box shapes for content, add borders to any or all sides of the style object, create custom list settings (such as bullet characters you specify), position an object absolutely, or apply extensions that insert page breaks or change the look of the cursor. After you have finished selecting options for the new style rule, the style name displays in the CSS Styles panel . Information about an internal style is stored in the Head area of the document.
You have learned the two preferred methods of supplying styles for a Web page: creating internal styles on a single page or external styles that can link to many pages. Earlier in this lesson, you created styles within HTML tags. These styles are called inline styles. When a browser applies styles, it gives the highest priority to inline styles. This means that you can use inline styles to override other styles. However, the use of inline styles is discouraged in most instances. One of the benefits of using CSS is that the styles are located in one place in a page or style sheet, so that a designer can easily make changes to the styles. Having inline code sprinkled throughout a document defeats the real purpose of using CSS. Dreamweaver CS5 provides a handy utility for converting inline CSS to a rule. In a code view, right click the inline style, click CSS Styles, and then click Convert Inline CSS to Rule. (Or, use the Format > CSS Styles > Convert Inline CSS to Rule command.)