لطفا منتظر باشید ...
Introducing Cascading Style Sheets
Cascading style sheets are collections of style and formatting information that you can apply consistently to multiple elements and across multiple pages. CSS can do much more than apply italics and right-align text. For example, you can assign a colored border to a single table cell in an otherwise borderless table using CSS styles, which is not possible using traditiona225. You can also control the positioning of block-level elements in a Web page. For example, you can set margins, padding, and so on.
A CSS style rule contains two parts: the selector and the declaration. The selector is the name of the style (such as h2 for level 2 headings, or p for body-text paragraphs), and the declaration defines the style elements' changes. The declaration consists of two parts: the property (such as font-size or background-color), and the property's value (such as 10 points to indicate a font size, or #000099 to specify a blue color).
The word "cascading" refers to the built-in inheritance of CSS. As you know, HTML elements are nested inside one another. At the outsidethe beginning and the end of a227 documentare the &l233> tags, and inside these tags are the <head> and <body> tags. Inside the <body> tag, if you use a CSS layers-based layout, you'll have <div> tags before you get to the first text element, which might be an <h1> heading tag. CSS takes advantage of this nested hierarchy by enabling formatting information to pass through this hierarchy. This cascading effect is illustrated in the following figure.
This figure shows the nesting of tags. It represents the tag hierarchy of a typical hyperlink. Hyperlinks are created with the <a> tag, and are often found inside <p> (paragraph text) tags. On the outside is the <body> tag (the figure does not show the &l233> tag outside the <body> tag). For the sake of argument, let's assume that this hyperlink is inside the footer, which is a specially formatted paragraph, different from regular paragraph text. Each of these elements might be formatted as follows:
<body>: Verdana, black, 12 points, left-aligned
<p.footer>: 10 points, center-aligned
<a>: Red
How would the link be formatted? Based on the principles of inheritance, it would be in the Verdana font (from the <body> tag), 10 points in size and center-aligned (from the p.footer style), and red (from the <a> tag).
A major advantage of CSS styles is that you can make sweeping changes to the site quickly and easily. When you update a CSS style, the formatting in all the documents that use that style are automatically updated to the new style, without you having to modify thei231 or even re-upload the changes to the server.
In addition to associating formatting with built-i227 tags (<body>, <p>, and so on), you can create custom CSS styles that you can apply to any portion of the document's content, whether it's only one portion of an existing tag or spans multiple tags. Dreamweaver refers to associating styles with built-in tags as redefinin220 tags.
In Dreamweaver, you can also use another approach, which is to create custom CSS classes. A CSS class is a custom collection of styles that you can apply to an existin220 tag, such as a <p> tag. You can use either or both approaches to defining CSS, based on the needs of your Web site. In general, you'll want to redefin218 tags first before developing custom CSS styles to avoid unnecessary code. You'll work with both approaches in this lesson.
