Things That Have Changed -- Formatting Text For Appearance
Part III -- HTML Level 4 -- In-Line Style Information The previous page contained CSS examples which work on the assumption that the information defining the styles which were used is located either in a <STYLE> section of the document in which the styles are used, or located in a separate file designated with a .CSS file extension and referenced using a <LINK> tag located in the Head section of the document in which the styles are used. Styles which are defined in a separate file and referenced with a <LINK> tag can be applied to an entire web site consisting of as many separate pages as you like, and changes to the style of the entire site can be made by making changes to the .CSS file. If the style information is located in a <STYLE> section, then the styles can only apply to the document which contains that section, however, changes to the style for the entire document can be made by modifying the information contained within the <STYLE> section for that document. There is another way to style content in a HTML document, and that is to use Inline Styles, in which the style information is actually included as a STYLE attribute in whichever tag is being used to mark up the content. For example, a <P> tag might contain a STYLE attribute which would change the style for just the paragraph marked up by that tag. Styling text in this way only affects content which is marked up by the tag containing the STYLE attribute. Here is an example of the use of inline styles using a <P> tag:
Note that the value of the STYLE attribute is all of the style information, properties and descriptors, and all of the style information is contained within one set of quotation marks ("margin-left: .5in; margin-right: .5in; font-family: times, palatino, serif; font-size 14pt; color: #FF0000"). The order of style properties is significant: The font weight, style and alignment must be specified before the others. There may also be other quirks (depending on which browser you're using) which can be fixed by changing the order in which the style attributes are listed. The following is a list of some of the more commonly used style properties and (more or less) commonly supported descriptor values for those properties. All of the following property/descriptor pairs can be used in any application of CSS, regardless of whether the use is inline or referenced from a separate file.
Grouping Style Properties The properties listed above are ones that you will probably use frequently in your style sheets, so the W3C specifies a shortcut notation. Instead of setting the attributes separately, you can combine them into one property called font. Thus, instead of P {font-family: times, serif;font-size: 12pt; line-height: 20pt; font-weight: bold; font-style: italic} you can simply use P {font: bold italic 12pt/20pt times, serif}The same can be done with margin descriptors, so instead of P {margin-left: -10px;margin-right: -10px; margin-top: 20px} you can use P {margin: 20px -10px -10px}You should also notice that negative values can be set for margin properties. This is useful if you wish to use overlapping to create text effects. It is possible to define several styles which overlap each other, creating a shadow or offset effect with text, which will load in a browser much more quickly than a graphic which contained similarly styled text. A complete guide to the use of level 4 cascading style sheets (CSS2) can be found here. Good luck! | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|