Subtitles of the Movie

Let me now give you an overview of what I'll be covering in this tutorial. The course starts with an examination of the concepts that lie at the heart of the CSS specification, including the syntax rules that will enable you to create your own styles with or without using Dreamweaver. The three type of Selector Types that make up the CSS Specification will be introduced, Custom Classes, Tag Redefines and Advanced CSS Selectors. Next I demonstrate how to create new styles and organize them into style sheets embedded into a page source code or a stand alone style documents. The Dreamweaver Styles Panel is also reviewed in detail, including how its used to manage, edit and apply styles. Now there are many ways to apply styles across a document, so next the three types of CSS Selectors will be covered in much more detail including examples and demonstrations of how their each created and used. Cascading Style Sheets are collections of styles that control the appearance of content in a web page. So the tutorial next covers how to best manage these styles in Dreamweaver. Included are descriptions of why the word Cascade is in the name Cascading Style Sheets and the rules that govern these Cascades. The concept of style inheritance and also tips for managing style cascades and inheritance. Next I review elements that constitute the building blocks of CSS Design Web Pages including Division or DIV Tags, Margins, Padding, Borders, Widths, Heights and much, much more. Now text is unarguably the most important element of any web page so CSS Techniques are then demonstrated and information provided to bring your boring text to life, helping you bridge the gap between print and web design and allowing for more design flexibility. This section will include information about choosing fonts, applying styles to text, setting line heights and letter spacing. Styling drop caps as well as some tips for improving text legibility. Now there's nothing like the right choice of colors to make a web page work and also nothing like the wrong colors to spoil your content. So next I demonstrate how to select color palettes, specify colors and use Dreamweaver to apply color to element backgrounds. Not all Graphic Image Formats are supported by modern browsers so I also in this section summarize the three important image formats to web designers, GIF files, JPEG files and PNG files. Now with HTML alone you're pretty much locked into a standard look for your lists once you make a decision to use a number or a certain bullet. However CSS allows web page designers much more creative freedom with their lists. So next I demonstrate all your design opportunities provided by CSS for formatting lists. Applying CSS to your links also provides added control and creative freedom, much more then you would get with the default link formatting that the browser provides. For example, CSS allows you to do all sorts of interesting roll over effects and events text highlighting or to have many sets of different colored links on a single page. I demonstrate all these features of CSS plus much more in the section of the tutorial entitled formatting links and lists. Now the first part of this tutorial deals with the common elements of design and how t format them with CSS to create nice looking and easy to manage web pages. But in the second part of the tutorial we'll look at how to use CSS to create custom layouts by placing content into columns. First I review layout basics including how to draw AP Dibs in your Dreamweaver documents to create your layouts. How to insert DIV Tags to create layouts and also how to apply floats and clearing to your layout elements. Next I thoroughly review the four types of element positioning possible with CSS when using Dreamweaver, Static Positioning, Relative Positioning, Absolute Positioning and Fixed Positioning. Applying the CSS Rules and properties that are covered in this tutorial will provide you with quite a number of layout types to work with in your website. So next I demonstrate a sampling of prebuilt CSS layout templates and themes that are available in the Dreamweaver new document dialog box. I'll demonstrate how to use templates that create various types of pages, pages with fixed widths, liquid layouts and also templates for working with a variety of elastic layouts. I conclude the tutorial by applying most of the CSS concepts that I covered in the tutorial through the use of two sample projects. In the first project I demonstrate how to modify the associated style sheets of one of the Dreamweaver Templates to create a custom page layout. In the second project I demonstrate how to build custom CSS based webpages from scratch, starting with the blank Dreamweaver page. Let me now go ahead and get started by introducing you to CSS and answering the question why you need to start using CSS to create your webpages.