Copyright Goodheart-Willcox Co., Inc. Chapter 13 Internet and the World Wide Web 543 Inline styles are embedded into the HTML fi le within the element being formatted. They are the fi rst priority of formatting, which means they override all other styles. For example, to modify the paragraph style: p style=“margin-left: 30px ”This paragraph is indented 30 pixels./p This style is in-line with the paragraph tag p. The margin-left property, which sets the left-hand margin of the element, is specifi ed as 30 pixels. Pixel is abbreviated as px. The text in the paragraph is: This paragraph is indented 30 pixels. Internal styles are defi ned in the head section of the HTML fi le. They are the second priority of formatting, which means they override all other styles except for inline styles. To set the left-hand margin as an internal style: head style p{margin-left: 30px } /style /head This sets the left-hand margin to 30 pixels, just as the previous inline style does. However, the difference is the inline style applies only to the one paragraph where the style is defi ned. The internal style applies to all paragraphs in the web page. Any text with the p tag will be indented by 30 pixels. External styles are similar to internal styles, but they are contained in a separate CSS fi le. They are the fi nal priority of formatting, which means they can be overridden by internal and inline styles. To set the left-hand margin as an external style sheet, this would be included in a CSS fi le: p{ margin-left: 30px } These are the most powerful because the style sheet is linked to many pages. When a style is updated in the external style sheet, every occurrence of the style in the entire website is updated. The best practice is to create external styles whenever possible. A good question to ask is, if the external styles are the most powerful and preferred option, why are they the lowest in the cascade of formatting priorities? The answer is simple: there may be formatting needed only one time on one page. An inline or internal style can meet this need. Changing the CSS fi le will not affect that formatting. An example of an external CSS is shown in Figure 13-22. It specifi es that the background image of the body of the web page will be an image named watermark.png, which is stored in the same web folder as the CSS fi le. If it is located in a different folder, the path must be specifi ed. The CSS also specifi es that any text defi ned with the h1 tag will be displayed in the dark blue color with right-hand justifi cation (alignment). Finally, each paragraph, which is defi ned by the p tag, will be indented 30 pixels from the left-hand page margin. To use this style sheet to control FYI FYI On some web servers, references to URLs are case sensitive, so always exactly match the capitalization in path and fi le names. Digital Coupons Many companies offer convenient digital coupons that are sent directly to customers through e-mail, text messages, or QR codes. Digital coupons eliminate the costs and resources involved in printing and physically distributing coupons. Digital coupons are a convenient and green solution that benefits both customers and businesses. Green Green Tech Tech