_Internet Technology
3341604
Assignment chap-#2
1: Explain structure of HTML.
=>>
An element called HTML surrounds the whole document. This element contains two sub-elements, HEAD and BODY. These elements are required to form any HTML document.
<HTML>
<head>
<title> the First Page</Title>
</head>
<body>
Hello world
</body>
</html>
--
<HTML>
<HEAD> it has sub-elements that defines header material:
<TITLE>it is a document title appears in browser's favorite or Bookmark list.
</TITLE>
<SCRIPT> it contains either JAVA Script or VB script.
</SCRIPT>
<HEAD>
<BODY> The remaining HTML elements are contained within these tags.
</BODY>
</HTML>
2: Explain radio button with example.
=>>
Radio buttons allow users to select only one option.
<INPUT TYPE ="RADIO">
Browser will display 🔘
~Radio button have the following attributes:
TYPE :-radio
CHECKED :-is blanked or CHECKED as the initial status.
NAME :-is the name of the variable to be sent to the CGI application.
VALUE :-usually has a set value.
Example---
<!DOCTYPE html>
<html>
<body>
<form action="/action_page.php">
<p>Please select your gender:</p>
<input type="radio" id="male" name="gender" value="male">
<label for="male">Male</label><br>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
3: Create a webpage which accept the student name, roll no, age and three subject marks and calculate total, average and display all info in table tag.
=>>
<html>
<head>
<TITLE>Grade Sheet</TITLE>
<LINK REL="STYLESHEET" HREF="pract11ITsub.css">
</head>
<% dim total, a, b, c, d, e, name, no, per, cl
a=request ("ict")
b=request ("oop")
c=request ("fosd")
d=request ("it")
e=request ("dm")
name=request("sn")
no=request("en")
cl=request("inst")
%>
<% total=a + 0 + b + c + 0 + d + 0 + e + 0 + f %>
<h1> GUJARAT TECHNOLOGICAL UNIVERSITY </h1>
<p>
Name : <%= name %>
<br>
Enrollment Number : <%= no%>
<br> Institute : <%= cl%> </p> <hr>
<table border=1 align=center>
<tr>
<th>Subject Name</th>
<th>Subject Code</th>
<th>Marks</th>
</tr>
<tr>
<td>INFORMATION COMMUNICATION TECHNOLOGY</td>
<td>3341601</td>
<td><%= a%></td>
</tr>
<tr>
<td>OBJECT ORIENTED PROGRAMMING</td>
<td>3341602</td>
<td><%= b%></td>
INTERNET TECHNOLOGY 21
</tr>
<tr>
<td>FUNDAMENTALS OF SOFTWARE DEVELOPMENT</td>
<td>3341603</td>
<td><%= c%></td>
</tr>
<tr>
<td>INTERNET TECHNOLOGY</td>
<td>3341604</td>
<td><%= d%></td>
</tr>
<tr>
<td>DATA MANAGEMENT</td>
<td>3341605</td>
<td><%= e%></td>
</tr>
<tr>
<td colspan=2 align=right><b>Total</b></td>
<td><%= total%></td>
</tr>
</table>
<center>
<Hr><b>
<% per= (total * 100)\350
response.write "Percentage "
response.write per%>
</b><Hr>
<% if per >= 70 then
response.write "Congratulations You got First Class with Distinction"
Elseif per >= 60 and per < 70 then
response.write "Congratulations You got First Class"
Elseif per >= 50 and per < 60 then
response.write "You got Second Class"
Elseif per >= 35 and per < 50 then
response.write "You got Pass Class"
Else
response.write "Sorry you are Fail"
End if
%>
CSS file code
table, td, th
{
border:1px solid green;
}
td
{
text-align:center;
}
th
{
background-color:green;
color:white;
}
h1
{
text-shadow: 5px 5px 5px #FF0000;text-align:center;
}
p
{
outline-style:groove;
outline-color:red;
font-family:"Times New Roman",Georgia,Serif;
text-align:center;
font-weight:bold;
}
4: Create webpage which display the Fibonacci series of a given term.
=>>
HTML Code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Fibonacci Series</title>
</head>
<body>
</body>
</html>
JavaScript Code:
var fibonacci_series = function (n)
{
if (n===1)
{
return [0, 1];
}
else
{
var s = fibonacci_series(n - 1);
s.push(s[s.length - 1] + s[s.length - 2]);
return s;
}
};
console.log(fibonacci_series(8));
5: Explain different type of List in HTML.
=>>
there are three type of list:--
1)Unordered List
2) Ordered List
3) Definition List.
1)Unordered List:- items in this list starts with a list mark such as bullet.
Browsers will usually change the list mark in nested lists.
<ul>
<li>list item</li>
<li>list item</li>
</ul>
2)Ordered List:- Items in this list are numbered automatically by the browser.
<ol>
<li>List item</li>
<li>List item</li>
<li>List item</li>
</ol>
1)Definition List:- This kind of list is different from the others. Each item in a DL consists of one or more Definition Terms, Followed by one or more Definition Descriptions.
<dl>
<dd>Hyper text markup language</dd>
<dt>Dog</dt>
<dd>They are better than human</dd>
</dl>
6: Explain Table tag with attributes with example.
=>>The Table allows to create boundaries that make positioning easier.
It contains four sub-elements; Table Row<tr> </tr>, Table Header <th> </th>, table Header <td> </td>, and Caption <caption> </caption>.
BGColor:- some browser support background color in table. The color you select will be expressed as a hexadecimal red-green-blue value.
Width:- You can specify the table width as an absolute number of pixels or a percentage of the document width.
Border:- The lines that form the boundary of each table cell when the file is displayed in the browser.
CellSpacing:- Cell Spacing represents the space between cells and is specified in pixels.
Cellpadding:- Cell Padding is the space between the cell border and the cell contents and is specified in pixels.
Align:- Tables can have left, right, or center alignment. To control the position of your table in your document you can use <center> or <div>.
Background:- Background image is tiled in Internet Explorer 3.0 and above.
Bordercolor:- The color of the border around the table.
7: Differentiate GET & POST method.
=>>
GET:-
GET requests remain in the browser history
GET requests can be cached
GET requests should never be used when dealing with sensitive data
GET requests can be bookmarked
POST:-
POST requests do not remain in the browser history
POST requests are never cached
POST requests have no restrictions on data length
POST requests cannot be bookmarked
8: Explain ROWSPAN & COLSPAN with suitable example
=>>
<TABLE BORDER="1" CELLPADDING="2">
<CAPTION ALIGN="BOTTOM">label for my table<CAPTION>
<TR>
<TH>Column 1 Header</TH>
<TH>Column 2 Header</TH>
</TR>
<TR>
<TD> COLSPAN="2">Row 1-Col 1 </TD>
</TR>
<TR>
</TD ROWSPAN="2">Row 2 - Col 1 </TD>
<TD>Row 2 - Col 2 </TD>
</TR>
<TR>
<TD>Row 3 - Col 2 </TD>
</TR>
</TABLE>
9: Explain cell spacing and cell padding with suitable example.
=>>
<TABLE BORDER=7 CELLPADDING=7 CELLSPACING=7>
<TR>
<TD>Red</TD>
<TD>Green</TD>
<TD>Blue</TD>
</TR>
<TR>
<TD>Orange</TD>
<TD>Yellow</TD>
<TD>Purple</TD>
</TR>
</TABLE>
10: Differentiate Static & Dynamic web pages.
=>>
Static:-
~Static Web Pages are simple in terms of complexity.
~In static web pages, Pages will remain same until someone changes it.
~In static web pages, Information are change rarely.
~.Static Web Page takes less time for loading than dynamic web page.
Dynamic:-
~Dynamic web pages are very complicated
~In dynamic web pages, Content of pages are not same for all visitors.
~In dynamic web page, Information are change frequently.
~Dynamic web page takes more time for loading.
11: Explain Text formatting tags of HTML.
=>>
the text formatting tags of html ar e given below:-
<b> - Bold text</b> it is used to bold text
<strong> text</strong> it is same as bold tag
<i> - Italic text</i> it is used to create italic tag
<em> - Emphasized text</em> it is same as italic tag
<mark>Marked text</mark> it is used to mark the text
<small> Smaller text</small> it is used to create a small text than normal text
<del> - Deleted text</del> it is used to strikethrough the text
<ins> - Inserted text</ins> it is used to create underlined text
<sub> - Subscript text</sub> it is used to create sub text.
<sup> - Superscript text</sup>it is used to create super text.
12: Define following <FRAMESET> attributes : Bordercolor,
Cols, Frameborder.
=>>
Bordercolor:- The color of the border around the table. This is supported properly by Navigator 4.0 and Internet Explorer 3.0 and above.
COLS:- Determines the size and number of rectangular columns within a <FRAMESET>. They are set from left to right of the display area.
Possible values are:
-Absolute pixel units, i.e. "480.160"
-A percentage of screen height, i.e.m"75%,25%"
-Proportional values using the asterisk (*).
Frameborder:- This element defines a single frame within a frameset. There will be a FRAME element for each division created by the FRAMESET element.
13: What is CSS? Explain its types.
=>>Cascading Style Sheet(CSS) is used to set the style in web pages that contain HTML elements. It sets the background color, font-size, font-family, color, … etc property of elements on a web page.
There are three type of CSS:--
1)Inline CSS:- the first method of adding style to a web page is to use the style attribute of a selected element.by using above syntax:-
<element style="property:value; property:value;..."> </element>
2)Embedded CSS:-To use an embedded style sheet, you define a style block ,which should be a placed in the <HEAD> section of the document.
3)Linked style CSS:- The easiest method for adding style to multiple HTML document is to use Linked Style Sheets .
A linked style sheet is a separate file that contains all of the style information.
14: Explain checkbox with example.
=>>The checkbox is shown as a square box that is ticked (checked) when activated.
The <input type="checkbox"> defines a checkbox.
<!DOCTYPE html>
<html>
<body>
<input type="checkbox" >
<label > I have a bike</label>
</body>
</html>
15: Create a webpage which display the factorial of number 7.
=>>
<!DOCTYPE html>
<html>
<head>
</head>
<body style = "text-align: center; font-size: 20px;">
<h1> Welcome to the javaTpoint.com </h1>
Enter a number: <input id = "num">
<br><br>
<button onclick = "fact()"> Factorial </button>
<p id = "res"></p>
<script>
function fact(){
var i, num, f;
f = 1;
num = document.getElementById("num").value;
for(i = 1; i <= num; i++)
{
f = f * i;
}
i = i - 1;
document.getElementById("res").innerHTML = "The factorial of the number " + i + " is: " + f ;
}
</script>
</body>
</html>
16: Write the appropriate tags for following uses and give
example of each. Head and body, text style bold, italic, underline,
font color, size, Paragraph, heading, list.
=>>
Head :--<head> head part of the html is here </head>
Body :--<body> body of html is here </body>
Bold :--<b> bold text here </b>
Italic:-- <i> italic text is here </i>
Underline:--<ins> underlined text is here </ins>
Font color <FONT COLOR = "#RRGGBB"> this text has color </FONT>
Font size :--<FONT SIZE ="+2> two sizes bigger</FONT>
Paragraph <p> paragraph is here lorem 30 </p>
Heading <h1> heading is here </h1> (there were 6 type of headings h1,...h6,).
List:-- <ol>
<li>List item</li>
<li>List item</li>
<li>List item</li>
</ol>
17: Create two webpages and link them with hyperlink.
=>>
First webpage:-- save it as form 1
<!DOCTYPE html>
<head>
<title>adding two webpages</title>
</head>
<body>
this is first webpage
<A HREF = "form2.html">second webpage</A>
</body>
</html>
Second webpage:-- save it as form 2
<!DOCTYPE html>
<head>
<title>second webpage</title>
</head>
<body>
<p>this is second webpage</p>
</body>
</html>
18: Explain HTML Form object with example.
=>>the firm object represents an HTML form. For each <form> tag in an HTML document, a Form object is created.
HTML forms works in all browsers and they are platform Independent.
Example:--
<html>
<head>
<title>sample form</title>
</head>
<body bgcolor="FFFFFF">
<form action="https://homemadestudy.blogspot.com/">
<p>
First Name:
<input type="text" name="fname" maxlength="50">
<br>
Last Name:
<input type="text" name="lname" maxlength="50">
</p>
<p>
<input type="submit" Name= "submit1" value="send info">
</p>
</form>
</body>
</html>
0 Comments