beautypg.com

Define css style list properties, Define css style positioning properties – Adobe Dreamweaver CC 2015 User Manual

Page 212

background image

205

CSS

Last updated 6/3/2015

Color

Sets the color of the border. You can set each side’s color independently, but the display depends on the

browser. Deselect Same For All to set the border color for individual sides of the element.

Same For All

Sets the same border color to the Top, Right, Bottom, and Left of the element to which it is applied.

4

When you are finished setting these options, select another CSS category on the left side of the panel to set additional
style properties, or click OK.

Define CSS style list properties

The List category of the CSS Rule Definition dialog box defines list settings, such as bullet size and type, for list tags.

1

Open the CSS Styles panel (Shift+F11) if it isn’t already open.

2

Double-click an existing rule or property in the top pane of the CSS Styles panel.

3

In the CSS Rule Definition dialog box, select List, and set any of the following style properties. (Leave the property
blank if it is not important to the style.)

List style type

Sets the appearance of bullets or numbers. Type is supported by both browsers.

List style image

Lets you specify a custom image for bullets. Click Browse (Windows) or Choose (Macintosh) to

browse to an image, or type the image’s path.

List style position

Sets whether list item text wraps and indents (outside) or whether the text wraps to the left

margin (inside).

4

When you are finished setting these options, select another CSS category on the left side of the panel to set additional
style properties, or click OK.

Define CSS style positioning properties

The Positioning style properties determine how the content related to the selected CSS style is positioned on the page.

1

Open the CSS Styles panel (Shift+F11) if it isn’t already open.

2

Double-click an existing rule or property in the top pane of the CSS Styles panel.

3

In the CSS Rule Definition dialog box, select Positioning, and then set the style properties you want.

Leave any of the following properties empty if they are not important to the style:

Position

Determines how the browser should position the selected element as follows:

Absolute places the content using the coordinates entered in the Placement boxes relative to the nearest

absolutely- or relatively-positioned ancestor, or, if no absolutely- or relatively-positioned ancestor exists, to the
upper-left corner of the page.

Relative places the content block using the coordinates entered in the Placement boxes relative to block’s position

in the text flow of the document. For example, giving an element a relative position and top and left coordinates
of 20px each will shift the element 20px to the right and 20px down from its normal position in the flow.
Elements can also be positioned relatively, with or without top, left, right, or bottom coordinates, to establish a
context for absolutely-positioned children.

Fixed places the content using the coordinates entered in the Placement boxes, relative to the top left corner of

the browser. The content will remain fixed in this position as the user scrolls the page.

Static places the content at its location in the text flow. This is the default position of all positionable HTML

elements.