Government Polytechnic, Addanki

Monday, 30 January 2017

HTML 5 AND CSS

HTML stands for Hyper Text Markup Language.

CSS stands for Cascading Style Sheets.

Style- How to display HTML elements.

A Website is 1)Presentation tool 2)Learning tool 3)Teaching tool 4)Marketing tool.

Some more tags on HTML5 :section,article,aside,header,footer,nav,dialog,figure.

CSS uses three references:

1)INLINE

2)INTERNAL

3)EXTERNAL

Program by using the above references

<html>

<head><style type=”text/css”>p{margin:20px;}</style> /* this is INTERNAL*/

</head>

<body>

<p style=”margin:10px;”>sometext</p> /* this is INLINE*/

</body>

</html>

BOX Model

DIV-division –It is nothing but a container

Some text

A PROGRAM USING CSS

H1{coloer:green;font-weight:bold;}

Body(background-color:yellow;}

P{color:blue;)

A program by using link to the above CSS program.

<!DOCTYPE HTML>

<HTML>

<HEAD>

<TITLE>COMPUTER</TITLE>

</HEAD>

<BODY>

<H1>INTRODUCTION TO COMPUTERS</H1>

<P>COMPUTER</P>

</BODY>

</HTML>

A program using DIV

H1{COLOR:GREEN;}

DIV{BACKGROUND-COLOR:RED;HEIGHT:200PX;WIDTH:200PX;BORDER:2PX;}

A program using above DIV program.

<!DOCTYPE HTML>

<HTML>

<HEAD>

<TITLE>COMPUTER</TITLE>

</HEAD>

<BODY>

<H1>INTRODUCTION</H1>

<BODY>

<HTML>

BOOTSTRAP is a framework to readily produce webpages. A tool for creating responsive web pages.

www.layoutit.com/build

For COLOR combinations KULER ADOBE.

VIDEO FORMATS:MPEG-4,WMV,QUICKTIME,REAL VIDEO.

Program for video

<!DOCTYPE HTML>

<HTML>

<BODY>

YOUR BROWSER DOESNOT SUPPORT HTML5 VIDEO

</VIDEO>

<P>

VIDEO COURTESY OF

BIGBUCKBUNNY</A>

</P>

</BODY>

</HTML>

CANSVAS:A medium for drawing ,painting,graphics via javascript.

A program using CANVAS

<!DOCTYPE HTML>

<HTML>

<BODY>

Var c=document.getElementById(“mycanvas”);

Var ctx=c.getcontext(“2d”);

Ctx.moveTo(0,0);

Ctx.lineTo(200,100);

Ctx.stroke();

</script>

</body>

</html>

Site reference:www.w3schools.com

Compiled by Y.Kiriti babu L/CME after attending the course at NITTTR Chennai from 23 Jan to 17 Jan 2017.

Government Polytechnic, Addanki

Pages

Monday, 30 January 2017

20 comments: