span tag and the div tag are *OK* man

"> span tag and the div tag are *OK* man

">

Presentation is loading. Please wait.

Presentation is loading. Please wait.

HTML BASICS <html> <head> <title> Test page </title> <body> <h1> Internet Programming </h1> <p> This is a sample web page in testing HTML commands </p>

Similar presentations


Presentation on theme: "HTML BASICS <html> <head> <title> Test page </title> <body> <h1> Internet Programming </h1> <p> This is a sample web page in testing HTML commands </p>"— Presentation transcript:

1 HTML BASICS <html> <head> <title> Test page </title> <body> <h1> Internet Programming </h1> <p> This is a sample web page in testing HTML commands </p> </body> </html>

2 <span> Applying styles to inline elements
Small chunk of HTML inside a line Example <p>The <span style="color:green">span tag</span> and the <span style="color:purple">div tag</span> are *OK* man </p>

3 <div> Large sections
The <div> tag defines a division or a section in an HTML document. The <div> tag is used to group block-elements to format them with CSS. Example: <html> <body> <p>This is some text.</p> <div style="color:#0000FF"> <h3>This is a heading in a div element</h3> <p>This is some text in a div element.</p> </div> </body> </html>

4 <table> <html> <body> <table bgcolor="gold" border="1" align="center" cellpadding="10px" cellspacing="10px" frame="void"> <tr> <th>Course</th> <th>Faculty</th> </tr> <td> IP </td> <td> Prof.M.Shobana </td> <td> PCD </td> <td> Prof.I.Kala </td> </table> </body> </html>

5 LIST UNORDERED LIST ORDERED LIST <html> <body>
<ul type="square"> (disc/circle) <li>PCD</li> <li>UI</li> <li>AI</li> </ul> </body> </html> ORDERED LIST

6 Heading document starts with a heading
can use different sizes for your headings <h1>, <h2>, <h3>, <h4>, <h5>, and <h6> <html> <head> <title>HeadingExample</title> </head> <body> <h1>This is heading 1</h1> <h2>This is heading 2</h2> <h3>This is heading 3</h3> <h4>This is heading 4</h4> <h5>This is heading 5</h5> <h6>This is heading 6</h6> </body> </html>

7 Paragraph Tag way to structure your text into different paragraphs.
opening <p> and a closing </p> tag  <html> <head> <title>Paragraph Example</title> </head> <body> <p>Here is a first paragraph of text.</p> <p>Here is a second paragraph of text.</p> <p>Here is a third paragraph of text.</p> </body> </html>

8 Line Break Tag <br /> element, anything following it starts from the next line <html> <head> <title>Line Break Example</title> </head> <body> <p>Hello<br /> You delivered your assignment ontime.<br/> Thanks<br /> Mahnaz </p> </body> </html>

9 <h1>This is <i>italic</i> heading </h1>
center Italic tag <h1>This is <i>italic</i> heading </h1> <html> <head> <title>Centring Content Example</title> </head> <body> <p>This text is not in the center.</p> <center> <p>This text is in the center.</p> </center> </body> </html> underlined tag <p>This is <u>underlined</u> paragraph</p> Bold Text <p>The following word uses a <b>bold</b> typeface.</p>

10 Inserted Text Strike Text
<p>I want to drink <del>cola</del> <ins>wine</ins></p> <p>The following word uses a <strike>strikethrough</strike> typeface.</p> Larger Text Superscript Text <p>The following word uses a <big>big</big> typeface.</p> <p>The following word uses a <sup>superscript</sup> typeface.</p>

11 Marked Text blockquote Strong Text
<p>The following word has been <mark>marked</mark> with yellow</p> <blockquote>XHTML 1.0 is the W3C's first Recommendation for XHTML, following on from earlier work on HTML 4.01, HTML 4.0, HTML 3.2 and HTML 2.0.</blockquote> Strong Text <p>The following word uses a <strong>strong</strong> typeface.</p>


Download ppt "HTML BASICS <html> <head> <title> Test page </title> <body> <h1> Internet Programming </h1> <p> This is a sample web page in testing HTML commands </p>"

Similar presentations


Ads by Google