Adobe Dreamweaver CC 2014 v.13 User Manual
Page 169
Note:
values of several properties using a single declaration. For example, the font property lets you set font-style, font-variant, font-
weight
, font-size, line-height, and font-family properties on a single line.
A key issue to note when using shorthand CSS, is that values omitted from a shorthand CSS property are assigned their default value. This may
cause pages to be incorrectly displayed when two or more CSS rules are assigned to the same tag.
For example, the h1 rule shown below uses longhand CSS syntax. Note that the font-variant, font-stretch, font-size-adjust, and
font-style
properties have been assigned their default values.
h1 {
font-weight: bold;
font-size: 16pt;
line-height: 18pt;
font-family: Arial;
font-variant: normal;
font-style: normal;
font-stretch: normal;
font-size-adjust: none
}
Rewritten as a single, shorthand property, the same rule might appear as follows:
h1 { font: bold 16pt/18pt Arial }
When written using shorthand notation, omitted values are automatically assigned their default values. Thus, the previous shorthand example
omits the font-variant, font-style, font-stretch, and font-size-adjust tags.
If you have styles defined in more than one location (for example, both embedded in an HTML page and imported from an external style sheet)
using both the short and long forms of CSS syntax, be aware that omitted properties in a shorthand rule may override (or cascade) properties that
are explicitly set in another rule.
For this reason, Dreamweaver uses the long form of CSS notation by default. This prevents possible problems caused by a shorthand rule
overriding a longhand rule. If you open a web page that was coded with shorthand CSS notation in Dreamweaver, be aware that Dreamweaver will
create any new CSS rules using the longhand form. You can specify how Dreamweaver creates and edits CSS rules by changing the CSS editing
preferences in the CSS Styles category of the Preferences dialog box (Edit > Preferences in Windows; Dreamweaver > Preferences on the
Macintosh).
The CSS Styles panel creates rules using only longhand notation. If you create a page or CSS style sheet using the CSS Styles panel, be
aware that hand coding shorthand CSS rules may result in the shorthand properties overriding those created in longhand form. For this reason,
use longhand CSS notation to create your styles.
162