Plus Two Computer Application Notes Chapter 5 Web Designing Using HTML

by

Kerala State Board New Syllabus Plus Two Computer Application Notes Chapter 5 Web Designing Using HTML.

Kerala Plus Two Computer Application Notes Chapter 5 Web Designing Using HTML

3 types of Lists in HTML.

1. Unordered List (<UL>) – Items are displayed with square, circle or disc in front.

2. Ordered List (<OL>) – Items are displayed with the following type values.

  • Type = 1 for 1,2, 3, ……..
  • Type = i for i, ii, iii, ………
  • Type = I for I, II, III, ……….
  • Type = a for a, b, c, ………..
  • Type = A for A, B, C, …………

3. Definition List (<DL>) – It is formed by definitions.
<L/> – It is used to specify List items.
<DT> – It is used to specify Definition Term.
<DD> – Used to specify the description
<A> is used to provide hyperlinks. Two types of linking. Its attribute is HREF.

1. External link – Used to connect 2 different web pages.
2. Internal link – Used to connect different locations of same page.

Concept of URL
URL means Uniform Resource Locator.
Two types of URL
a) Relative URL – Here we explicitly give the web site address
Eg: <A href=http://www.hscap.kerala.gov.in>

b) Absolute URL – Here we implicitly give the website address. The path is not specified here.
Eg: Consider the web pages index.html and school.html saved in the folder C:\BVM.
The file indexs.html contains the following.
<A href=”school.html”>.

Here we did not specify the full path of the file school.html. But this implicitly points to the file stored in C:\BVM

Creating Graphical hyperlinks
It can be achieved by using the <img> tag inside the <a> tag.
Eg: <A href=”school.html”><img src=”schoo|.jpg”></A>

Creating E- mail linking
It can be achieved by using the key word mailto as a value to href attribute
Eg: <A href=mailto:”info@spark.gov.in”> SPARK</A>

Insert music and videos
<embed> tag is used to add music or video to the page

Attributes

  • src – specifies the file to play
  • width – Specifies the width of the player
  • height – Specifies the height of the player
  • hidden – Used to specifies the player is visible or not
  • <noembed> – Used to specifies an alternate when the browser does not support the <embed> tag.

Attribute

  • src – Used to specify the image file
  • alt – Used to specify the alternate text

Eg:
<html>
<head>
</head>
<body>
Here is a tag embed to play music
<embed src=”c:\alvis.wma” width=”500″ height=”500″ hidden=”true”> </embed>
</body>
</html>

<bgsound> tag
This tag is used to play back ground song or music
Eg:
<html>
<head>
</head>
<body>
<bgsound src=”c:\alvis.wma” loop=”infinite”>
</body>
</html>

  • <Table> is used to create a table.
  • <TR> is used to create a row.
  • <TH> is used to create heading cells.
  • <TD> is used to create data cells.

<Table> Attributes

  1. Border – It specifies the thickness of the borderlines.
  2. Bordercolor – Color for borderlines.
  3. Align – Specifies the table alignment in the window.
  4. Bgcolor – Specifies background colour.
  5. Cellspacing – Specifies space between table cells.
  6. Cellpadding – Specifies space between cell border and content.
  7. Cols – Specifies the number of columns in the table.
  8. Width – Specifies the table width.
  9. Frame – Specifies the border lines around the table.
  10. Rules – Specifies the rules (lines) and it overrides the border attribute. Values are given below:
    • none – display no rules
    • cols – display rules between columns only(vertical lines)
    • rows – display rules between rows only(horizontal lines)
    • groups – display rules between row group and column groups only
    • all – rules between all rows and columns

<TR> attributes

  1. align – specifies the horizontal alignment. Its val¬ues are left, right, centre or justify.
  2. Valign – Specifies the vertical alignment. Its values are top, middle, bottom or baseline.
  3. Bgcolor – Used to set background-color

<TH> and <TD> attributes

  1. Align – specifies a horizontal alignment. Its values are left, right, centre or justify.
  2. Valign – Specifies vertical alignment. Its values are top, middle, bottom or baseline.
  3. Bgcolor – Specifies border color for the cell.
  4. Colspan – Specifiesthenumberofcolumnsspan for the cell.
  5. Rowspan – Specifies the number of rows span for the cell.

Frameset – It is used to divide the window into more than one pane. It has no body section.

<Frameset> attributes

  1. cols – It is used to divide the window vertically.
  2. rows – It is used to divide the window horizontally.
  3. border – specifies the thickness of the frame border.
  4. bordercolor – specifies the color of the frame border.

Frame – It specifies the pages within a frameset.

<Frame> attributes

  1. SRC – specifies the web page.
  2. Scrolling – Scroll bar is needed or not its values are yes, no or auto.
  3. Noresize – It stops the resizing of the frame.
  4. Margin width and Marginheight – Sets margins
  5. Name – To give a name for the frame.
  6. Target – specifies the target.

<Noframe> – It is used to give content when some browsers that do not support frameset.
Nesting of framesets
Step 6: Finally execute the frame.html file

<Form> – It is used to take data from the users and send to the server.

<Input> – It is used to create input controls. Its type attribute determines the control type.

Main values of the type attribute are given below.

  1. Text – To create a text box.
  2. Password – To create a password text box.
  3. Checkbox – Tq^teate a check box.
  4. Radio – To create a radio button.
  5. Reset – To create a Reset button.
  6. Submit-To creates a submit button.
  7. Button – To create a button

To create a group of radio buttons, then the name attribute must be the same.

<Textarea> is used to create a multiline text box. <Label> It is used to give labels.

<Select> It is used to create a list box or combo box. The items must be given by using <option> tag.

Attribute

Name – Specifies the name of the object to identify

Size – If it is 1, the object is a combo box otherwise it is a list box.

Multiple – Allows selecting multiple items

<Form> attributes

1) Action – Here we give the name of the program (including the path) stored in the Webserver.
2) Method – There are 2 types of methods get and post.

Plus Two Computer Application Notes Chapter 5 Web Designing Using HTML 1

3) Target – Specifies the target window for displaying the result. Values are given below.

  • _blank – Opens in a new window
  • _self – Opens in the same frame
  • _parent – Opens in the parent frameset
  • _top – Opens in the main browser window
  • name – Opens in the window with the specified name.
  • <Fieldset> tag

This tag is helpful to divide a form into different subsections and form groups. <legend> tag used to give a caption forthe <fieldset> section.