Page 1 :
CHAPTER-8, , CASCADING STYLE SHEET, (CSS), , 8.1 Introduction, , CSS stands for Cascading Style Sheet. CSS is a formatting language, used to, provide more customised web pages and make it easier to make multiple pages by, using the same style., , Using CSS, you can define colours, backgrounds, borders, margins, alignment,, fonts, sizes and loads of other things for almost any part of your web pages. Almost, all web browsers support CSS., , CSS is designed primarily to enable the separation of the document content and, , document format. As a result, we can improve content accessibility and we can, similarly format two or more documents., , 8.2 Features of CSS, , Features of CSS are :, , (i) Flexibility, , Style sheets provide flexibility within a web document. We can associate a, , style sheet that controls the entire site and we can also set up an individual, style sheet to control a single page. The individual style sheet override the, , global one. Moreover, we can also associate style sheet to control a single, tag element., , [190], , Scanned with CamScanner
Page 2 :
(ii), , (iii), , (iv), , (v), , (vi), , (vil), , and la, , Multiple pages use the same style, , CSS makes it easier to make multiple pages use the same style, , Cascading, , The Cascading means that many stylesheets can be used and will be merged, by the browser to provide a computed style for each element. If styles defined, for one element oppose each other, the later one will be used, , Apply CSS without consideration of browser, , If the browser does not understand something, it will ignore it and move on to, the next attribute. It will not display warnings. This can make things easier In, some circumstances, since you can apply styles without having to worry that, a browser might ignore the entire stylesheet or ignore the parts that it does not, understand., , Each object inherits styles from its parent object, , Each object inherits some styles from its parent object or parent class. The, object are referred to by their element tag. The highest object in the structure, is the html element. If any elements do not have their own CSS defined but, the htm! element does, then the cascading behaviour means they will inherit, from the html element. For example, if in the html element we define the text, , colour to be white, then any tables will also have white writing in them., , Reduces download time, The CSS file is downloaded just once by the visitor's browser and re-used for, different pages on 2 website. This reduces the bandwidth requirements for, , your server and also ensures a faster download for your visitors., , Easy to make changes to the layout, , CSS is a means of separating the content of an html document from the style, yout of that document. Therefore, CSS makes it very easy to change, , (191), , Scanned with CamScanner
Page 3 :
the style of a document. For example, suppose we want to move the picture in, the title of each page to the right by 10 pixels. In a table based design, we, would have to open every page and alter the table width manually. Fortunately,, we have used CSS, and we have to do is to open our CSS file while stores the, layout of the site, and change the number relating to the position of the image,, that will change his position throughout the whole site., , (viii) Accessibilty, , Separating style from content makes life very easy for visitors who prefer to, , view only the content of a web page, or to modify the content., (ix) More control over presentation, , You have finer and more predictable control over presentation by using CSS., (x) Very Small File Size, , Probably, the mostly useful feature of CSS is that all of the style and layout is, , removed from the html, so the html page size is very much smaller., , 8,3/ Creating Style Sheet, , A style sheet is a set of instruction that tells a browser how to display a particular, type of HTML element. Each instruction has syntax. The basic syntax is as follows., , Declaration, , , , , , , , , , , Property name : value;, , , , Selector{, , This syntax has two parts, the selector and the declaration., , (a) Selector, Almost all HTML tags or elements are selectors. Selector tells a browser which, , elements in a page are governed by the particular rule., [192], , , , , , i sj food, Scanned withCamScanner
Page 4 :
(b) Declaration, Specifies the property and value., ° Declaration is contained between "{"..."}"., e Declaration end with a semicolon., The declaration has two parts :, (i) | Property (e.g. ‘color’) and, (ii) Value (e.g. 'red’)., , Properties tell a browser how to display elements that are selected by the rule, , Example :, , , , P { color: red; }, , , , , , , , P (i.e. paragraph) is the selector in this example. There is one declaration that, the color property of the paragraph will be red. The combination of a declaration, , and a selector is knows as a rule., Example :, , Declaration part can have one or more declarations, , P { color: red; font-size : 10px; }, , When the declarative part has a lot declarations, then we can describes it as, , follows :, , pt, color: red;, font-size: 10px;, , [193], , py, , Scanned with CamScanner
Page 5 :
8.4 css Comments, , css comment starts with "/*", and end with "*/"., , Example :, , Bet, , color: red;, , /* This is a comment */, font-size: 10px;, , }, , 8.5 File Names, We can write CSS by using tools such as Notepad on Window's or TextEdit on, the MacOS., When you save the CSS document, you should follow the following file name rules., (i) Always use the "css" as file extension., , (ii) | Use only alphabets, numbers, "-(hyphen)" and “_(underscore)"., , 8.6 Kinds of Selector, , Commonly used kinds of selectors are :, (i) Type Selector, A type selector is the name of HTML Tag., , Example :, , {sample .html11), , |, <p> First Pparagraph</p>, <p> Second paragraph</p>, , Nee ee ear, , , , Scanned with CamScanner