{"id":4730,"date":"2008-09-10T21:58:52","date_gmt":"2008-09-11T02:58:52","guid":{"rendered":"http:\/\/magic1host.com\/blog\/2008\/09\/10\/dreamweaver-cs3-and-cascading-style-sheets\/"},"modified":"2008-09-10T21:58:52","modified_gmt":"2008-09-11T02:58:52","slug":"dreamweaver-cs3-and-cascading-style-sheets","status":"publish","type":"post","link":"https:\/\/magic1host.com\/blog\/?p=4730","title":{"rendered":"Dreamweaver CS3 and Cascading Style Sheets"},"content":{"rendered":"
by Andrew Whiteman<\/div>\n

Cascading Style Sheets (CSS) is a W3C standard mark-up language for defining the appearance of web pages. The use of CSS allows developers to fully separate the content of the page from its presentation, speeding up the development process and also making the pages load more quickly in the browser. Whereas 20th century websites typically used tables to construct web pages and position elements, CSS now provides a cleaner and more efficient way of controlling all aspects of web page layout.<\/p>\n

The range of computer users who have some involvement in building web pages and web sites is vast and a good many of these users choose Dreamweaver as the software tool that helps them create the web content they need without needing to become an expert on underlying technologies such as CSS. Dreamweaver CS3 includes better support for Cascading Style Sheets than previous versions. However, there is still room for improvement.<\/p>\n

Previous versions of Dreamweaver assumed that most users would be using tables to control the layout of their web pages. Dreamweaver CS3 is the first version of the program which encourages users to create CSS-based web page layouts. When the users create a new web page, they are offered a series of CSS layouts, on which they can base the new page, consisting of single, double and three column designs.<\/p>\n

Pages created using CSS rely heavily on the use of the HTML DIV element, a multipurpose container of web content. Choosing one of the Dreamweaver CSS presets creates a page containing a series of DIV elements complete with placeholder text and the CSS code necessary to control the position and dimension of the DIVs. The placeholder text and HTML code both contain brief explanations of the techniques used and advice on how to customise these basic pages for your own purposes.<\/p>\n

The CSS generated by Dreamweaver when creating these preset layouts is embedded within the page itself. Updating a site where every page has embedded CSS code would be extremely inefficient. A far better arrangement is to keep all of the CSS in a single file. Luckily, Dreamweaver has a nifty feature for moving CSS definitions from an HTML page to an external CSS file. You just highlight all of the CSS you wish to export, right click the selection and choose “Move CSS Rules” from the “CSS Styles” context menu.<\/p>\n

Although this ability to move CSS around is really great, it’s not something that beginners will necessarily think of doing. It points to the fact that Dreamweaver could still do with a few enhancements to its implementation of CSS.<\/p>\n

Dreamweaver CS3 still has includes the automatic creation of CSS styles whenever the user applies font attributes to text. Simply removing the ability to select text and apply these basic attributes would prevent this from happening. From a beginner’s point of view, it would be far more useful to just have a “Style” menu with an option to create a new style if no styles already exist.<\/p>\n

\n
About the Author:<\/div>\n
Author is a developer and trainer with Macresource Computer Solutions<\/a>, an independent computer training company offering Adobe Dreamweaver Classes<\/a> in London and throughout the UK.<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Cascading Style Sheets (CSS) is a W3C standard mark-up language for defining the appearance of web pages. The use of CSS allows developers to fully separate the content of the page from its presentation, speeding up the development process and also making the pages load more quickly in the browser. Whereas 20th century websites typically used tables to construct web pages and position elements, CSS now provides a cleaner and more efficient way of controlling all aspects of web page layout.<\/p>\n","protected":false},"author":273,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[40],"tags":[112],"class_list":["post-4730","post","type-post","status-publish","format-standard","hentry","category-web","tag-web"],"_links":{"self":[{"href":"https:\/\/magic1host.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/4730","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/magic1host.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/magic1host.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/magic1host.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/273"}],"replies":[{"embeddable":true,"href":"https:\/\/magic1host.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=4730"}],"version-history":[{"count":0,"href":"https:\/\/magic1host.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/4730\/revisions"}],"wp:attachment":[{"href":"https:\/\/magic1host.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=4730"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/magic1host.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=4730"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/magic1host.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=4730"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}