1 / 7

Browsers and CSS

Dr. L. Braender: The comment tags will hide the CSS code from older browsers that do recognize Cascading Style Sheets. Browsers and CSS. <HTML> <TITLE>Dr. Bra……</TITLE> <STYLE TYPE=“text/css”> <!- - H1 { color: green} - -> <BODY> … </BODY> </HTML>. Dr. L. Braender:

janet
Download Presentation

Browsers and CSS

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Dr. L. Braender: The comment tags will hide the CSS code from older browsers that do recognize Cascading Style Sheets. Browsers and CSS <HTML> <TITLE>Dr. Bra……</TITLE> <STYLE TYPE=“text/css”> <!- - H1 { color: green} - -> <BODY> … </BODY> </HTML> Dr. L. Braender: The style type allows for the possibility of new formatting standards in the future.

  2. CSS Inheritance HTML TITLE BODY H1 P UL LI LI LI

  3. Anatomy of a Rule Selector Property Value H1 { color: darkslateblue } Declaration

  4. Declaration Styles .name { position: absolute; ... font-family: ”Arial"; } All declarations must be contained within the pair of curly braces. A semi-colon separates the declaration and may - but doesn’t have to - also appear at the end of the last declaration. Also, to make your code easier to read, place each declaration on its own line.

  5. Grouping Selectors H1 { font-weight: bold } H2 { font-weight: bold } H3 { font-weight: bold } or H1, H2, H3 { font-weight: bold }

  6. Grouping Selectors H1, H2, H3 { color: darkslateblue; font-weight: demi-bold; font-family: ”Arial"; } H1 { font-size: 36px;} H2 { font-size: 30px;}

  7. Overriding Inheritance <STYLE TYPE=“text/css”> BODY { color=“darkgray; background=“white”; } H1 { color=“lightgrey”; background=“red”;} </STYLE>

More Related