beautypg.com

Create a page with a css layout – Adobe Dreamweaver CC 2014 v.13 User Manual

Page 163

background image

Note:

To the top

Note:

Fixed








Main Content


Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum.


Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,
odio.


H2 level heading


Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at
nonummy quam ante ac quam.




The above example code is a simplified version of the code that creates the two-column fixed left sidebar layout when you create a new

document using the predesigned layouts that come with Dreamweaver.

Create a page with a CSS layout

When creating a new page in Dreamweaver, you can create one that already contains a CSS layout. Dreamweaver comes with 16 different CSS
layouts that you can choose from. Additionally, you can create your own CSS layouts and add them to the configuration folder so that they appear
as layout choices in the New Document dialog box.

Dreamweaver CSS layouts render correctly in the following browsers: Firefox (Windows and Macintosh) 1.0, 1.5, 2.0, and 3.6; Internet Explorer
(Windows) 5.5, 6.0, 7.0, and 8.0; Opera (Windows and Macintosh) 8.0, 9.0, and 10.0; Safari 2.0, 3.0, and 4.0; and Chrome 3.0.

For an informational article that explains how to use the CSS layouts that come with Dreamweaver, see the

Dreamweaver Developer Center

.

There are also more CSS layouts available on the

Adobe Dreamweaver Exchange

.

Create a page with a CSS layout

1. Select File > New.

2. In the New Document dialog box, select the Blank Page category. (It’s the default selection.)

3. For Page Type, select the kind of page you want to create.

You must select an HTML page type for the layout. For example, you can select HTML, ColdFusion®, PHP, and so on. You cannot

create an ActionScript™, CSS, Library Item, JavaScript, XML, XSLT, or ColdFusion Component page with a CSS layout. Page types in the
Other category of the New Document dialog box are also restricted from including CSS page layouts.

4. For Layout, select the CSS layout you want to use. You can choose from 16 different layouts. The Preview window shows the layout and

gives a brief description of the selected layout.

The predesigned CSS layouts provide the following types of columns:

Column width is specified in pixels. The column does not resize based on the size of the browser or the site visitor’s text settings.

156

This manual is related to the following products: