Introduction to CSS
- 1. Introduction to CSS By - Aursalan Sayed
- 2. By - Aursalan Sayed Webpage with CSS Webpage without CSS
- 3. What is CSS? Cascading Style Sheets, fondly referred to as CSS, is a simple design language intended to simplify the process of making web pages presentable. By - Aursalan Sayed
- 4. Advantages of CSS CSS saves time - You can write CSS once and then reuse the same sheet in multiple HTML pages. You can define a style for each HTML element and apply it to as many web pages as you want. Pages load faster - If you are using CSS, you do not need to write HTML tag attributes every time. Just write one CSS rule of a tag and apply it to all the occurrences of that tag. So, less code means faster download times. Easy maintenance - To make a global change, simply change the style, and all the elements in all the web pages will be updated automatically. Superior styles to HTML - CSS has a much wider array of attributes than HTML, so you can give a far better look to your HTML page in comparison to HTML attributes. Multiple Device Compatibility - 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 cellphones or for printing. Global web standards – Now HTML attributes are being deprecated and it is being recommended to use CSS. So it’s a good idea to start using CSS in all the HTML pages to make them compatible with future browsers. By - Aursalan Sayed
- 5. Who Creates and Maintains CSS? CSS is created and maintained through a group of people within the W3C called the CSS Working Group. The CSS Working Group creates documents called specifications. When a specification has been discussed and officially ratified by the W3C members, it becomes a recommendation. These ratified specifications are called recommendations because the W3C has no control over the actual implementation of the language. Independent companies and organizations create that software. By - Aursalan Sayed
- 6. CSS History CSS was first proposed by Håkon Wium Lie on October 10, 1994. At the time, Lie was working with Tim Berners-Lee at CERN. Several other style sheet languages for the web were proposed around the same time, and discussions on public mailing lists and inside World Wide Web Consortium resulted in the first W3C CSS Recommendation (CSS1) being released in 1996. In particular, a proposal by Bert Bos was influential; he became co- author of CSS1, and is regarded as co- creator of CSS. By - Aursalan Sayed
- 7. CSS Versions CSS 1 The first CSS specification to become an official W3C Recommendation is CSS level 1, published on December 17, 1996. CSS 2 CSS level 2 specification was developed by the W3C and published as a recommendation in May 1998. CSS 2.1 CSS level 2 revision 1, often referred to as "CSS 2.1", was published as a W3C Recommendation on 7 June 2011. CSS 3 Unlike CSS 2, which is a large single specification defining various features, CSS 3 is divided into several separate documents called "modules". Each module adds new capabilities or extends features defined in CSS 2, preserving backward compatibility. Work on CSS level 3 started around the time of publication of the original CSS 2 recommendation. The earliest CSS 3 drafts were published in June 1999. Due to the modularization, different modules have different stability and statuses. CSS 4 There is no single, integrated CSS4 specification, because the specification has been split into many separate modules which level independently. By - Aursalan Sayed
- 8. CSS Syntax A CSS comprises of style rules that are interpreted by the browser and then applied to the corresponding elements in your document. A style rule is made of three parts: • Selector: A selector is an HTML tag at which a style will be applied. This could be any tag like <h1> or <table> etc. • Property: A property is a type of attribute of HTML tag. Put simply, all the HTML attributes are converted into CSS properties. They could be color, border, etc. • Value: Values are assigned to properties. For example, color property can have the value either red or #F1F1F1 etc. You can put CSS Style Rule Syntax as follows: selector { property: value } Example: You can define a table border as follows: table { border :1px solid #C00; } Here table is a selector and border is a property and the given value 1px solid #C00 is the value of that property. By - Aursalan Sayed
- 9. CSS Inclusion Embedded CSS - The <style> Element Inline CSS - The style Attribute External CSS - The <link> Element Imported CSS - @import Rule By - Aursalan Sayed