In the early days of the Web, nine different proposals were made to the World Wide Web Consortium, the main standards organization for the Web which is more commonly known as the W3C, for a style sheet language to help separate the visual appearance of a document from its content. In 1994, Cascading HTML Style Sheets was proposed by Håkon Wium Lie, now CTO of Opera Software (a company you’ll meet again later in this chapter), but at the time he was working at CERN with Tim Berners-Lee and Robert Cailliau, the two men who invented the World Wide Web. CHSS became CSS because CSS can be applied to more than just HTML, and in December 1996 the CSS level 1 Recommendation was published.
Since then, three more CSS specifications have been published by the W3C. CSS 2 became a recommendation in 1998, with CSS 2.1 (which fixes a few mistakes in 2), and CSS 3 currently existing as candidate recommendations. Although CSS 3 is still under development, CSS 2.1 is likely to become a fully fl edged recommendation in the near future and is well supported by all modern browsers. In this book, you will cover CSS 2.1 as it stands today and take a look at some of the new features in CSS 3 that you can use in browsers today.
advantage of css
By using CSS for the presentation of a document, you can substantially reduce the amount of time you spend composing not only a single document but an entire website As you’ll discover, CSS is much more versatile than the styling mechanisms provided by HTML alone. The versatility of CSS, when harnessed effectively, can reduce the amount of hard disk space that a website occupies, as well as the amount of bandwidth required to transmit that website from the server to the browser. CSS has the following advantages:
➤ The presentation of an entire website can be centralized to one or a handful of documents, enabling the look and feel of a website to be updated at a moment’s notice. In legacy HTML documents, the presentation is contained entirely in the body of each document. Cascading Style Sheets brings a much needed feature to HTML: the separation of a document’s structure from its presentation. Cascading Style Sheets can be written independently of HTML.
➤ Browsers are beginning to support multiple alternative style sheets, a feature that allows more than one design of a website to be presented at the same time. The user can simply select the look and feel that he or she likes most. This could only be done previously with the aid of more complex programming languages.
➤ Style sheets allow content to be optimized for more than one type of device. By using the same HTML document, different versions of a website can be presented for handheld devices such as PDAs and cell phones or for printing.
➤ Style sheets download much more quickly because web documents using CSS commonly consume less bandwidth. Browsers also use a feature called caching, a process by which your browser will download a CSS file or other web document only once, and not request that file from the web server again unless it’s been updated, further providing your website with the potential for lightning-fast performance.
➤ Users of a website can compose style sheets of their own, a feature that makes websites more accessible. For example, a user can compose a high-contrast style sheet that makes content easier to read. Many browsers provide controls for this feature for novice users, but it is Cascading Style Sheets nonetheless. These features, along with the power of the cascade, which you will read about in Chapter 4, makes the planning, production, and maintenance of a website simpler with Cascading Style Sheets than with HTML alone. By using Cascading Style Sheets to present your web documents, you can cut days of development and planning time.
How to write
To write CSS, just as is the case when writing HTML source, you will need a text editor. Word processing programs such as Microsoft Word aren’t ideally suited for CSS, because they automatically do lots of things that are helpful when writing a letter or book, such as correct spelling but get in the way when writing code. Instead, you want something that doesn’t make any changes that you don’t want to what you type but lets you write and save plain text. The Windows Notepad program is one example of a text editor that is ideal for composing source code.
To launch Notepad, choose Start –> Run and then type Notepad in the Open textbox. On Mac OS X, the Notepad equivalent is Text Edit, which can be found in the Mac OS X Applications folder. There are more advanced text editors that will do useful things such as color your code so that it is clear which parts do what (this is known as syntax highlighting) or automatically complete code for you when you’ve started typing. Editors available for Windows include:
➤ Notepad++:- http://sourceforge.net/projects/notepad-plus/ (free)
➤ Crimson Editor:- www.crimsoneditor.com (free)
➤ HTML-kit:- www.chami.com/html-kit (free)
And here are some alternative text editors that work with Mac OS X:
➤ TextWrangler:- www.barebones.com (free)
➤ TextMate:- http://macromates.com/ (retail with 30 day free trial)
➤ You can find more text editors suitable for CSS and HTML at http://en.wikipedia.org/ wiki/List_of_HTML_editors In addition, there is the very popular Adobe Dreamweaver (www.adobe.com/products/dreamweaver), which combines a text editor with a WYSIWYG (or What You See Is What You Get) code generator, which lets you use a graphical interface to create web pages in HTML and CSS. To follow along with the code in this book, you must use the code view of Dreamweaver or similar application rather than the WYSIWYG view. You must create HTML files with the .html extension. If you use Notepad or Text Edit, beware of your files being saved with a .txt extension, which will not result in a web browser interpreting your file as ordinary text rather than HTML.
To ensure that your files are saved properly on Windows, choose Start–> Run and type Explorer (or right-click Start and choose Explore from the pop-up menu) to open Windows Explorer. After Windows Explorer is open, choose Tools –> Folder Options to open the Folder Options window, click the View tab, and unchecked the Hide Extensions for Known File Types box. Then click OK. On Mac OS X, open Finder, and go to Finder –> Preferences. Select the Advanced tab, and check the box for Show All File Extensions.
I hope that you understand my post. if you like this post then share my post, and comment on my post if you have any suggestion or Queries related to Cascading Style Sheets. Thank you!