Introduction to Cascading Style Sheets

Cascading Style Sheets Tushar Joshi

Basic Concepts ,[object Object],[object Object],[object Object],H1 { color: blue } Selector Declaration property value Simple CSS Rule

Basic Concepts ,[object Object],[object Object],<HTML> <HEAD> <TITLE>title</TITLE> <LINK REL=STYLESHEET TYPE="text/css“ HREF="http://style.com/cool" TITLE="Cool"> <STYLE TYPE="text/css"> @import url(http://style.com/basic); H1 { color: blue } </STYLE> </HEAD> <BODY> <H1>Headline is blue</H1> <P STYLE="color: green"> While the paragraph is green. </BODY> </HTML>

Basic Concepts ,[object Object],[object Object],[object Object],[object Object]

Basic Concepts ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Basic Concepts ,[object Object],[object Object],[object Object]

Basic Concepts ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Basic Concepts ,[object Object],[object Object],[object Object],<HTML> <HEAD> <TITLE>Title</TITLE> <STYLE TYPE="text/css"> H1.pastoral { color: #00FF00 } </STYLE> </HEAD> <BODY> <H1 CLASS=pastoral>Way too green</H1> </BODY> </HTML>

Basic Concepts ,[object Object],[object Object],[object Object],<HTML> <HEAD> <TITLE>Title</TITLE> <STYLE TYPE="text/css"> .pastoral { color: #00FF00 } </STYLE> </HEAD> <BODY> <H1 CLASS=pastoral>Way too green</H1> <P CLASS=pastoral>My Paragraph</P> </BODY> </HTML>

Basic Concepts ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Basic Concepts ,[object Object],[object Object],A:link { color: red } /* unvisited link */ A:visited { color: blue } /* visited links */ A:active { color: lime } /* active links */

Basic Concepts ,[object Object],[object Object],A.alpha:link { color: red } /* unvisited link */ A.beta:visited { color: blue } /* visited links */ A.gamma:active { color: lime } /* active links */ <a class=alpha>Click Me</a>

Basic Concepts ,[object Object],[object Object],[object Object],A:link IMG { border: solid red } <A class=alpha><IMG SRC=flower.gif></A>

Basic Concepts ,[object Object],[object Object],[object Object],[object Object],[object Object],In CSS1, all '@import' statements must occur at the start of a style sheet

Basic Concepts ,[object Object],[object Object],[object Object],[object Object],[object Object]

Basic Concepts ,[object Object],[object Object],[object Object],[object Object],Formatting Model

Basic Concepts ,[object Object],[object Object]

Reference Material ,[object Object],[object Object],[object Object],[object Object]

Introduction to Cascading Style Sheets

Recomendados

Recomendados

Mais conteúdo relacionado

Mais procurados

Mais procurados (20)

Destaque

Destaque (20)

Semelhante a Introduction to Cascading Style Sheets

Semelhante a Introduction to Cascading Style Sheets (20)

Mais de Tushar Joshi

Mais de Tushar Joshi (7)

Último

Último (20)

Introduction to Cascading Style Sheets