Join Joseph Lowery for an in-depth discussion in this video Customizing a layout, part of Layouts with CSS in Dreamweaver.
Dreamweaver sample layouts are really intended to be just starting point.…The CSS is basically set up so you can easily customize the layout to fit your design.…In this video I'm going to show you the key structural elements like page and…column width so you can easily modify them to get the layout you want.…Let's start by going to File>New and then in the New Document dialog box make…sure you have Blank Page selected, HTML Page Type and under Layout let's go with…two column fixed, left sidebar, header and footer.…
We will leave the DocType at XHTML 1.0 Transitional, which is the Dreamweaver…default and Layout CSS as Add to Head.…Click Create and there is our page.…Now the first thing that I typically do when I am working with a page if I am…restructuring it I'll go ahead and change the overall width of the page…regardless of whether it's fixed or liquid.…In this case with this fix page we are going to want to change of the pixel…measurement for the outside element which is called container.…
- Exploring HTML5 templates in Dreamweaver
- Understanding document flow
- Using floats properly
- Resetting CSS styles
- Creating a 1-, 2-, or 3-column layout
- Deciding on a fixed width versus variable width design
- Coding layouts for HTML5 and CSS 3
- Incorporating floated elements
- Applying the faux column technique
- Using Spry widgets
- Using Multiscreen Preview
- Modifying desktop layout for tablets
- Developing smart phone layouts
Skill Level Intermediate
Site Navigation with CSS in Dreamweaverwith Joseph Lowery3h 24m Intermediate
Typography with CSS in Dreamweaverwith Joseph Lowery2h 30m Intermediate
Dreamweaver CS5 Essential Trainingwith James Williamson15h 22m Beginner
1. Dreamweaver Example Layouts
2. Layout Concepts
3. Basic Layouts
4. Interior Layouts
5. Alternative Screen Layouts
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.