| What you need to know about CSS! Style sheet | | | | quicker page downloads. For example, the HTML |
| is a progressive breakthrough for the | | | | element h2 specifies that the text contained |
| advancement of web. Today, more and more | | | | within it is a level two heading. It has a |
| browsers are implementing style sheets, | | | | lower level of importance than h1 headings, |
| opening authors' eyes to unique features that | | | | but a higher level of importance than h3 |
| allow influence over presentation while | | | | headings. This aspect of the h2 element is |
| preserving platform independence. The | | | | structural . Customarily, headings are |
| advantages of style sheets have become - | | | | rendered in decreasing order of size, with h1 |
| apparent -- and the disadvantage of | | | | as the largest, because larger headings are |
| continually creating more HTML tags -- galore | | | | usually interpreted to have greater |
| -- for presentation effects with the gradual | | | | importance than smaller ones. Headings are |
| development of CSS. Let's understand CSS in | | | | also typically rendered in a bold font in |
| the right perspective. Style sheets in | | | | order to give them additional emphasis. The |
| retrospect Style sheets have been around in | | | | h2 element may be rendered in bold face, and |
| one form or another since the beginnings of | | | | in a font larger than h3 but smaller than h1 |
| HTML in the early 1990s . As the HTML | | | | . This aspect of the h2 element is |
| language grew, however, it came to encompass | | | | presentational . Prior to CSS, document |
| a wider variety of stylistic capabilities to | | | | authors who wanted to assign a specific |
| meet the demands of web developers . With | | | | color, font, size, or other characteristic to |
| such capabilities, style sheets became less | | | | all h2 headings had to use the HTML font |
| important, and an external language for the | | | | element for each occurrence of that heading |
| purposes of defining style attributes was not | | | | type. Moreover, CSS can be used with XML, to |
| widely accepted until the development of CSS. | | | | allow such structured documents to be |
| Teething problems with implementation of CSS | | | | rendered with full stylistic control over |
| Many implementations of CSS are fraught with | | | | layout, typography, color, and so forth in |
| inconsistencies, bugs and other quirks . | | | | any suitable user agent or web browser. CSS |
| Authors have commonly had to use hacks and | | | | has its share of inconsistencies as well CSS |
| workarounds in order to obtain consistent | | | | may at times be misused, particularly by the |
| results across web browsers and platforms . | | | | author of web documents. Some developers who |
| One of the most well-known CSS bugs is the | | | | are accustomed to designing documents |
| Internet Explorer box model bug; box widths | | | | strictly in HTML may overlook or ignore the |
| are interpreted incorrectly in several | | | | enabling features of CSS. For instance, a |
| versions of the browser, resulting in blocks | | | | document author who is comfortable with HTML |
| which appear as expected in most browsers, | | | | markup that mixes presentation with structure |
| but are too narrow when viewed in Internet | | | | may opt to use strictly embedded CSS styles |
| Explorer. The bug can be avoided, but not | | | | in all documents. While this may be an |
| without some cost in terms of functionality. | | | | improvement over using deprecated HTML |
| This is just one of hundreds of CSS bugs that | | | | presentational markup, it suffers from some |
| have been documented in various versions of | | | | of the same problems that mixed-markup HTML |
| Internet Explorer, Netscape, Mozilla, and | | | | does; specifically, it entails a similar |
| Opera many of which reduce the legibility of | | | | amount of document maintenance. Discrepancies |
| documents. The proliferation of such bugs in | | | | compared: CSS vs programming languages CSS |
| CSS implementations has made it difficult for | | | | also shares some pitfalls common with |
| designers to achieve a consistent appearance | | | | programming languages. In particular, the |
| across platforms. Currently there is strong | | | | problem of choosing appropriate names for CSS |
| competition between Mozilla's Gecko layout | | | | classes and identifiers may afflict CSS |
| engine, Opera's Presto layout engine , and | | | | authors. In the attempt to choose descriptive |
| the KHTML engine used in both Apple's Safari | | | | names for CSS classes, authors might |
| and the Linux Konqueror browsers - each of | | | | associate the class name with desired |
| them is leading in different aspects of CSS. | | | | presentational attributes; for example, a CSS |
| Internet Explorer remains the worst at | | | | class to be applied to emphasized text might |
| rendering CSS by standards set down by World | | | | be named "bigred," implying that it is |
| Wide Web Consortium as of 2005 . Some | | | | rendered in a large red font. While such a |
| breakthroughs … These problems have | | | | choice of naming may be intuitive to the |
| preisely led the W3C to revise the CSS2 | | | | document author, it can cause problems if the |
| standard into CSS2.1, which may be regarded | | | | author later decides that the emphasized text |
| as something of a working snapshot of current | | | | should instead be green; the author is left |
| CSS support. CSS2 properties which no browser | | | | with a CSS class called "bigred" that |
| had successfully implemented were dropped, | | | | describes something that is green. In this |
| and in a few cases, defined behaviours were | | | | instance, a more appropriate class name might |
| changed to bring the standard into line with | | | | have been "emphasized," to better describe |
| the predominant existing implementations.. | | | | the purpose or intent of the class, rather |
| What makes style sheets significant enough? | | | | than the appearance of elements of that |
| et representsStyle she an enormous step | | | | class. In a programming language, such a |
| forward for the Web. With the separation of | | | | misuse might be analogous to using a variable |
| content and presentation between HTML and | | | | name "five" for a variable which contains the |
| style sheets, the Web no longer needs to | | | | value 5; however, if the value of the |
| drift away from the strong ideal of platform | | | | variable changes to 7, the name is no longer |
| independence that provided the medium with | | | | appropriate. CSS in a nutshell CSS is used by |
| its initial push of popularity. Authors can | | | | both the authors and readers of web pages to |
| finally influence the presentation of | | | | define colors, fonts, layout and other |
| documents without leaving pages unreadable to | | | | aspects of document presentation. It is |
| users A style sheet is made up of style rules | | | | designed primarily to enable the separation |
| that tell a browser how to present a | | | | of document structure (written in HTML or a |
| document. There are various ways of linking | | | | similar markup language) from document |
| these style rules to your HTML documents, but | | | | presentation (written in CSS). This |
| the simplest method for starting out is to | | | | separation provides a number of benefits, |
| use HTML's STYLE element. This element is | | | | including improved content accessibility, |
| placed in the document HEAD, and it contains | | | | greater flexibility and control in the |
| the style rules for the page. Functionality | | | | specification of presentational |
| and Usage of CSS CSS is well-designed to | | | | characteristics, and reduced complexity of |
| allow the separation of presentation and | | | | the structural content. CSS is also capable |
| structure. Prior to CSS, nearly all of the | | | | of controlling the document's style |
| presentational attributes of an HTML document | | | | separately in alternative rendering methods, |
| were contained within the HTML code; all font | | | | such as on-screen in print, by voice (when |
| colors, background styles, element | | | | read out by a speech-based browser or screen |
| alignments, borders and sizes had to be | | | | reader) and on braille-based, tactile |
| explicitly described, often repeatedly, in | | | | devices. CSS allows complete and total |
| the midst of the HTML code. CSS allows | | | | control over the style of a hypertext |
| authors to move much of that information to a | | | | document. The only way this can be |
| stylesheet, resulting in considerably simpler | | | | illustrated in a way that gets people excited |
| HTML code. The HTML documents become much | | | | is by demonstrating what it can truly be, |
| smaller and web browsers will usually cache | | | | once the reins are placed in the hands of |
| sites' CSS stylesheets. This leads to a | | | | those able to create beauty from structure. |
| reduction in network traffic and noticeably | | | | |