Web development ppt used to design web applocation

HTML Welcome to all

HTML Introduction HTML : HTML stands for H yper T ext M arkup L anguage HTML is not a programming language, it is a markup language A markup language is a set of markup tags HTML uses markup tags to describe web pages Html is platform independent language

What is CSS? What is CSS? CSS stands for C ascading S tyle S heets Styles define how to display HTML elements Styles were added to HTML 4.0 to solve a problem

What is JavaScript? What is JavaScript? JavaScript was designed to add interactivity to HTML pages .

DHTML DHTML is NOT a language. DHTML is a TERM describing the art of making dynamic and interactive web pages. DHTML combines HTML, JavaScript, the HTML DOM, and CSS.

Session 1 What is web page? The basic unit of information displayed over the net is a web page . What is web site ? It is a collection of web pages . URI : uniform resources Identifier Home page Communication b/w server and a browsers Feature

3 kind of network LAN : local area network WAN : wide area network MAN: metropolitan area network

Types of webpage Static web pages Dynamic web pages

Structure of Html <!DOCTYPE html> <html> <head> <title>my html</title> </head> <body> Welcome to html </body> </html>

Attributes & Tags < body bgcolor =“red”> bgcolor=attributes , red= values Tags helps to add picture , movies, heading etc Ex : <h1> ……………….. </h1>

Basic tags elements in html Paragraph: <p> </p> break: <br> or <br/> Heading : H1,H2,H3,H4,H5,H6 HR: <hr> <hr color=“red” width=“75%” size=“4”> Pre: <pre ></pre> (space) Center:<center> </center>

Basic text elements in html Superscript:<sup> </sup> Subscript :<sub> </sub> Bold :<b> </b> I :<i> </i> u :<u> </u> Big :<big> </big> Small :<small> </small> Strike :<strike > </strike >

Basic text elements in html Delete :<del> </del> Insert :<ins> </ins> Strong :< Strong > < /Strong > Color text : 2 ways : <font size color face> </font> or <p style=“color: green;font-size:8;”> </p> (inline css)

Basic text elements in html Marquee :<marquee> </marquee> Acronym :< Acronym title=“meaning”></ Acronym title> Cite (meaning):Reference <cite>google.com</cite> Divided :<div> </div> Marquee bgcolor=“red” < Marquee> <span style=“background- color: red”>html</span></marquee>

Basic text elements in html <marquee direction =“right” scrollamount =“30”> <marquee behavior="alternate"> Image <img src=“moon.jpg”/> <img src="sunset.gif" /> < img src=“moon.jpg” width=“50” height=“200” alt=“it is a moon”/> Alter : alt=“united nation org”

HTML Quotation Tag Description < abbr > Defines an abbreviation or acronym <address> Defines contact information for the author/owner of a document < bdo > Defines the text direction < blockquote > Defines a section that is quoted from another source <cite> Defines the title of a work <q> Defines a short inline quotation <mark> For highlight

HTML Computer Code Elements Tag Description <code> Defines programming code < kbd > Defines keyboard input < samp > Defines computer output < var > Defines a variable <pre> Defines preformatted text

List 3 types : Unordered list Ordered list Definition list Unordered list : type="square" type="disc" type="circle" <h4 align="center">Shopping List</h4> <ul > <li>Milk</li> <li>chocolate</li> <li>Cereal</li> <li>Bread</li> </ul>

list Ordered list <h4 align="center">Goals</h4> <ol> <li>Find a Job</li> <li>Get Money</li> <li>Move Out</li> </ol> Lower-Case Letters, Upper-Case Letters , Lower-Case Numerals , Upper-Case Numerals, Roman-letters

Definition list <dl> < dt ><b> Fromage </b></ dt > < dd >French word for cheese.</ dd > < dt ><b>Voiture</b></ dt > < dd >French word for car.</ dd > </dl> Fromage French word for cheese. Voiture French word for car. <dl> - defines the start of the list < dt > - definition term < dd > - defining definition

Tables <table border="1"> < tr ><td>Row 1 Cell 1</td> <td>Row 1 Cell 2</td></ tr > < tr ><td>Row 2 Cell 1</td> <td>Row 2 Cell 2</td></ tr > </table>

Tables <table border="1"> < tr > < th >Column 1</ th > < th >Column 2</ th > < th >Column 3</ th > </ tr > < tr > <td rowspan ="2">Row 1 Cell 1</td> <td>Row 1 Cell 2</td><td>Row 1 Cell 3</td></ tr > < tr ><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></ tr > < tr ><td colspan ="3">Row 3 Cell 1</td></ tr > </table>

Cell Padding and Spacing Cell Padding and Spacing With the cell padding and cell spacing attributes you will be able to adjust the white space on your tables. Spacing defines the space between two cells , while padding represents the distance between cell borders and the content of a cell. Color has been added to the table to emphasize these attributes.

Table <table border="1" cellspacing ="10" bgcolor=" rgb (0,255,0)"> < tr > < th >Column 1</ th > < th >Column 2</ th > </ tr > < tr ><td>Row 1 Cell 1</td> <td>Row 1 Cell 2</td></ tr > < tr ><td>Row 2 Cell 1</td> <td>Row 2 Cell 2</td></ tr > </table>

Tables <table border="1" cellpadding ="10" bgcolor=" rgb (0,255,0)"> < tr > < th >Column 1</ th > < th >Column 2</ th > </ tr > < tr ><td>Row 1 Cell 1</td><td>Row 1 Cell 2</td></ tr > < tr ><td>Row 2 Cell 1</td><td>Row 2 Cell 2</td></ tr > </table>

link <a href ="2.html">click here</A> <a href ="2.html“ target=“_blank”>click here</A> <A HREF="MAILTO:[email protected]">FEEDBACK</A> <A HREF="3.HTML"> <IMG SRC="images2.jpeg"></a> <a href="http://www.google.co.in/">google</a>

HTML Comment Tags Comment tags  are used to insert comments in HTML . Ex:  <p>This is a paragraph.</p>

Form: HTML web forms are a composition of buttons, checkboxes, and text input fields embedded inside of HTML documents with one goal in mind: to capture user input. By doing things such as providing fields for user data such as names, phone number, and email addresses, web forms give users the opportunity to interact directly with a webpage. <html> <body> <form><caption><center>APPLICATION FORM</center></caption> First Name:</td><td><input type="text" maxlength="15" size="30" value="john"> Last Name:</td><td><input type="text" maxlength="15" size="30" value="Ford">

form Gender:</td><td><input type="radio" name="gender" value="male">M <input type="radio" name="gender" value="female" checked>f Education:<input type="checkbox" name=" ug "> ug <input type="checkbox" name="pg">pg< br >< br > Password:<input type="password" maxlength="10" size="30">< br >< br >

form Country: <select name="country"> <option> choose</option> <option>India</option> <option>England</option> <option>Sri lanka </option> </select>< br >< br > Feedback:< textarea rows="5" cols="20"> </ textarea > <input type="submit" value="submit"> <input type="reset" value="reset">

Frame( With frames, several Web pages can be displayed in the same browser window. <html> <frameset cols="25%,50%,25%"> <frame src ="a.html" /> <frame src ="b.html" /> <frame src =“c.html" /> </frameset> </html>

frame <html> <frameset rows="25%,50%,25%"> <frame src ="frame_a.htm" /> <frame src ="frame_b.htm" /> <frame src ="frame_c.htm" /> </frameset> </html>

Nested framesets <html> <frameset rows="50%,50%"> <frame src ="frame_a.html" /> <frameset cols="25%,75%"> <frame src ="frame_b.html" /> <frame src ="frame_c.html" /> </frameset> </frameset> </html>

Iframe: An iframe is used to display a web page within a web page. <iframe src="oline.html" width="350" height="150" scrolling="auto" frameborder ="1"> </iframe> <The End>

Web development ppt used to design web applocation

About This Presentation

Slide Content

Tags

Categories

Download

Quick Actions

Statistics

Related Slideshows

Web development ppt used to design web applocation

About This Presentation

Slide Content

Slide 1

Slide 2

Slide 3

Slide 4

Slide 5

Slide 6

Slide 7

Slide 8

Slide 9

Slide 10

Slide 11

Slide 12

Slide 13

Slide 14

Slide 15

Slide 16

Slide 17

Slide 18

Slide 19

Slide 20

Slide 21

Slide 22

Slide 23

Slide 24

Slide 25

Slide 26

Slide 27

Slide 28

Slide 29

Slide 30

Slide 31

Slide 32

Slide 33

Slide 34

Tags

Categories

Download

Quick Actions

Statistics

Related Slideshows

Pray For The Peace Of Jerusalem and You Will Prosper

Don_t_Waste_Your_Life_God.....powerpoint

VILLASUR_FACTORS_TO_CONSIDER_IN_PLATING_SALAD_10-13.pdf

Fertility awareness methods for women in the society

Chapter 5 Arithmetic Functions Computer Organisation and Architecture

syakira bhasa inggris (1) (1).pptx.......