Download - Html

Transcript
Page 1: Html

HTML 4.01

Mohd Ridza bin Mohd ZainuriSyah Ali Reza bin Yaacob

Ahmad Affendi bin HashimMuhammad Nur bin Ismail

Page 2: Html

2

HTML Is the predominant markup language

for web pages. HTML can also describe, to some

degree, the appearance and semantics of a document, and can include embedded scripting language code which can affect the behavior of web browsers and other HTML processors.

Page 3: Html

3

<IFrame> Tag

Page 4: Html

4

Definition and Usage

HTML element which makes it possible to embed another HTML document inside the main document

Example :

Source Output<iframe src ="/default.html"width=15% height=15%></iframe>

<html><body bgcolor="blue"></body></html>

Page 5: Html

5

IFrame Standard Attributes

Standard attributes such as : id – A unique id for the element class - The class of the element title – A text to display in a tool tip style - An inline style definition

Page 6: Html

6

IFrame Optional Attributes

Align - how to align the iframe according to the surrounding text

Frameborder – display a frame border or not Height – Defines the height of the iframe Longdesc - A URL to a long description of the

frame contents Marginheight - Defines the top and bottom

margins of the iframe Marginwidht - Defines the left and right margins of

the iframe

Page 7: Html

7

IFrame Optional Attributes (Cont…)

Name – Specifies a unique name of the iframe

Scrolling – Define scroll bars Src – The URL of the document to show

in the iframe Width - Defines the width of the iframe

Page 8: Html

8

<span> Tag

Page 9: Html

9

Definition and Usage

The <span> tag is used to group inline-elements in a document.

Page 10: Html

10

ExampleSource Output

<p>This is a paragraph <span style="color:#0000FF;">This is a paragraph</span> This is a paragraph</p> <p>

<span style="color:#FF000;">This is another paragraph</span></p>

This is a paragraphThis is a paragraphThis is a paragraph

This is anotherparagraph

Page 11: Html

11

Example Output

Page 12: Html

12

Standard Attributes

Id - A unique id for the element Class - The class of the element Title - A text to display in a tool tip Style - An inline style definition Dir - Sets the text direction Lang - Sets the language code

Page 13: Html

13

Event Attributes Mouse Event

Onclick - What to do on a mouse click Ondblclick - What to do on a mouse doubleclick Onmousedown - What to do when mouse button is pressed Onmouseup - What to do when mouse button is released Onmouseover - What to do when mouse pointer moves over

an element Onmousemove - What to do when mouse pointer moves Onmouseout - What to do when mouse pointer moves out of

an element

Keyboard Event Onkeypress - What to do when key is pressed and released Onkeydown - What to do when key is pressed onkeyup - What to do when key is released

Page 14: Html

14

<div> Tag

Page 15: Html

15

<div> Tag

<div> tag is used for defining a division/section in a HTML document.

Syntax Output

ABC123<div style="color: green;"> <h4>This is a header in a div section</h4><p>TEST</p></div>

Page 16: Html

16

<div> attributes

<div> tags can attach several attributes for formatting the text.

Standard attributes such as: id, class, title, style, dir, align.

Event attributes such as: onclick, onmouseover, onkeypress.

Page 17: Html

17

Example

ABC123<div style="color: blue;“

align="center"><h2>TTT</h2><p>TEST</p> </div>

Page 18: Html

18

Screenshot

Page 19: Html

19

<frame>, <frameset> Tag

Page 20: Html

20

Definition <frame>

Defines a sub window (a frame). 

Page 21: Html

21

Definition <frameset>

Used to organize multiple windows (frames).

Each frame holds a separate document.

Page 22: Html

22

Example of Codes

<html><frameset cols = "25%, 25%,*">  <frame src ="venus.htm" />  <frame src ="sun.htm" />  <frame src ="mercur.htm" /> </frameset></html>

Page 23: Html

23

Attributes - <frame>

Page 24: Html

24

Attributes - <frameset>