Download as pptx, pdf, or txt
Download as pptx, pdf, or txt
You are on page 1of 53

Html introduction

 HTML (Hypertext Markup Language) code, we may be familiar with the fact that it is
used to create most web pages.
 There have been several versions of HTML since the Web began, and the development of
the language is overseen by an organization called the W3C (World Wide Web
Consortium).
 The last major version of HTML was HTML 4.01 in December 1999. In January 2000,
some stricter rules were added to HTML 4.01, creating what is known as XHTML
(Extensible Hypertext Markup Language)
 Latest version is HTML5
 HTML is widely used language on the web.
 We can create a static website by HTML only.
 Technically, HTML is a Markup language rather than a programming language.
 Internet:- A global computer network providing a variety of information and
communication facilities, consisting of interconnected networks using standardized
communication protocols.
 The World Wide Web (abbreviated WWW or the Web) is an information space where
documents and other web resources are identified by Uniform Resource Locators (URLs),
interlinked by hypertext links, and can be accessed via the Internet.
 English scientist TimBerners-Lee invented the World Wide Web in 1989. He wrote the
first web browser computer program in 1990 while employed at CERN in Switzerland.
The Web browser was released outside CERN in 1991, first to other research institutions
starting in January 1991 and to the general public on the Internet in August 1991.
 The World Wide Web has been central to the development of the Information Age and is
the primary tool billions of people use to interact on the Internet. Web pages are primarily
text documents formatted and annotated with Hypertext Markup Language (HTML).
 WWW is another example of client/server computing. Each time a link is followed, the
client is requesting a document (or graphic or sound file) from a server (also called a Web
server) that's part of the World Wide Web that "serves" up the document.
 The server uses a protocol called HTTP or Hyper Text Transport Protocol. The standard
for creating hypertext documents for the WWW is Hyper Text Markup Language or
HTML. HTML essentially codes plain text documents so they can be viewed on the Web.
 Browsers: WWW Clients, or "Browser": The program we used to access the WWW is
known as a browser because it "browses" the WWW and requests these hypertext
documents. Browsers can be graphical, allows to see and hear the graphics and audio.
 Uniform Resource Locators, or URLs: A Uniform Resource Locator, or URL is the
address of a document found on the WWW. Browser interprets the information in the
URL in order to connect to the proper Internet server and to retrieve your desired
document. Each time a click on a hyperlink in a WWW document instructs browser to
find the URL that's embedded within the hyperlink.
 The elements in a URL: Protocol://server's address/filename
Tags: An HTML tag surrounds the content and apply
meaning to it. It is written between < and > brackets. The
two brackets and all of characters between them is known as
tags.
Elements: An HTML element is an individual component
of an HTML file. In an HTML file, everything written
within tags are termed as HTML elements.
The basic distinction between tags and elements is very
important to understand:
a tag is made up of a left - and right - angle bracket and
letters and numbers between those brackets, whereas
elements are the opening and closing tags plus anything
between the two tags.
<!Doctype html>
< html >
< head >
< title > Popular Websites: Google < /title >
< /head >
< body >
< h1 > About Google < /h1 >
< p > Google is best known for its search engine, although Google now
offers a number of other services. < /p >
< /body >
< /html >
Version Information - Doctype
 A basic HTML page starts with the Document Type Declaration or doctype.
That is a way to inform the browser what type of document it is. The doctype
is always the first item at the top of any HTML file.
 Talking about the past, we can say that the doctype declaration used to be
very unpleasant and difficult to remember.
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
 NOW IT IS DECLARED AS
<!Doctype html>
The <html> element
The <html> element follows the doctype information, which is used to inform the
browser that this is an HTML document. we can use the lang attribute with
the "en" value to specify that the document is in English
SYNTAX:
<!DOCTYPE HTML>
<html lang="en"> </html>
The <head> section

• The < head > element contains information about the document, which is not
displayed within the main page itself.
• The <head> element contains metadata (document title, character set, styles,
links, scripts), specific information about the web page that is not displayed to
the user.
• The <meta> element is used to specify the metadata to provide browsers and
search engines with technical information about the web page.
SYNTAX:
• <meta name="Author" content=“HTML">
 To define the character encoding for the document, you need to set
the charset attribute with the "utf-8" value in nearly all cases. UTF-8 is the
default character encoding for HTML5.
<meta charset="utf-8">
 <title> element to define the title of your document.
 <title>HYPERTEXT MARKUP LANGUAGE</title>
 The <link> tag sets the relationship between the current document and the
external resource. It is generally used to link to the external CSS stylesheet.
 <link> elements should be placed in the <head> section of the document
(commonly before the closing </head> tag), and they can be used many times.
 The <link> tag is empty, which means that the closing tag isn’t required. It
contains only attributes.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>link tag</h1>
<p>which is used to link css file.</p> </body> </html>
The <body> element
 The < body > element holds the actual content of the page that is viewed in your
browser
 The <body> of a document contains the content of the document. The content
may be presented by a user agent in different ways. E.g., the content can be text,
images, links, colors, graphics, etc.
 Syntax:
<body> ... </body>
< html>
<head>
<meta charset = "utf-8">
<title>...</title>
</head>
<body>
<header>...</header>
<nav>...</nav>
<article>
<section>
...
</section>
</article>
<aside>...</aside>

<footer>...</footer>
</body>
The <header> element
 Use the <header> element to define a header for the document or section. It
usually contains a logo, search bar, navigation links, etc.
 Syntax:
<header></header>
The <nav> element
It defines a block of navigation links, either within the current document or
to other documents. Note, that not all links in the HTML document can be placed
inside the <nav> element; it can only include major navigation blocks.
The <article> element is used to define an independent, self-contained content
(articles, blog posts, comments, etc.). The content of the element has its meaning,
and it is easily differentiated from the rest of the webpage content.
Syntax:
<article> <p>Text of the article</p> </article>
The <section> element
The <section> element is used to group standalone sections within a webpage containing
logically connected content (news block, contact information, etc.).
<section>
<h1>Header</h1>
<p>Some paragraph for example</p>
</section>
<section>
<h2>Header 2</h2>
<p>Another paragraph for example.</p> </section>
<aside > element:
The HTML <aside> tag provides information about the main content. According to W3C
definition, the <aside> element represents content that forms the main textual flow of a document.
Tags over view
 The six levels of heading tags < h1 > , < h2 > , < h3 > , < h4 > , < h5 > , and < h6 >
 Paragraphs < p > , preformatted sections < pre > , line breaks < br / > , horizontal rule
</hr>
 Presentational elements: < b > , < i > , < u > , < s > , < tt > , < sup > , < sub > , < strike > ,
< big > , < small > .
 Phrase elements such as < em > , < strong > , < abbr > , < acronym > , < dfn > ,
< blockquote > , < q > ,< cite > , < code > , < kbd > , < var > , < samp > , and
< address >
 meta tags <Doctype>,<title>,<link>,<style>
 Lists such as unordered lists using < ul > and < li > , ordered lists using < ol > and < li > ,
and
 definition lists using < dl > , < dt > , and < dd >
 Editing elements such as < ins > and < del >
 Grouping elements: < div > and < span >
<h1 > , < h2 > , < h3 > , <
h4 > , < h5 > , < h6 >
Basic Text
Formatting
< p > , < br / > , < pre >
White space and flow

 &nbsp (non breakable space):only one space will be displayed


 This is known as white space collapsing
The align Attribute (Deprecated)
 The align attribute indicates whether the heading appears to the left, center, or
right of the page (the default is the left)
 we will have noticed that the word “ deprecated ” appears in parentheses in the
heading of this section.
 This indicates that the align attribute has been marked for removal from future
versions of the HTML and XHTML specifications.
 Example:
< h1 align=”left” > Left-Aligned Heading < /h1 >
< p > This heading uses the align attribute with a value of left. < /p >
< h1 align=”center” > Centered Heading < /h1 >
< p > This heading uses the align attribute with a value of center. < /p >
< h1 align=”right” > Right-Aligned Heading < /h1 >
< p > This heading uses the align attribute with a value of right. < /p >
Phrase elements
 The <em> Element The content of an <em> element is intended to be a point of
emphasis in your document, and it is usually displayed in italicized text
 The < strong > Element The < strong > element is intended to show strong
emphasis for its content — stronger emphasis than the <em> element. As with the
<em> element, the <strong> element should be used only when you want to add
strong emphasis to part of a document
 The < address > Element Many documents need to contain a snail - mail address,
and there is a special < address > element that is used to contain addresses
 The < abbr > Element when we are using an abbreviated form by placing the
abbreviation between opening<abbr> and closing </abbr> tags.
 The < acronym > element allows you to indicate that the text between opening <
acronym > and closing< /acronym > tags is an acronym .
 The < dfn > element allows you to specify that we are introducing a special term. Its use is similar
to the italicized font
 The < blockquote > Element Is for Quoting Text
 < q > element for use with smaller quotations
 The < cite > Element Is for Citations to find documents that reference certain works, or a browser
could collect the contents of < cite > elements to generate a bibliography for any given document,
 The < code > Element Any code to appear on a web page should be placed inside a < code >
element. Usually the content of the < code > element is presented in a monospaced font.
 The < kbd > Element Is for Text Typed on a Keyboard
 The < var > Element Is for Programming Variables
 The < samp > Element Is for a Program Output
HTML Colors

There are three ways of how you can change the color of the text in HTML: using Hex color codes, HTML
color names or RGB values.
Hex Color Codes
A hex color code is a hex triplet, which represents three separate values defining the levels of the component
colors.
It is specified with a hexadecimal (hex) notation for a mixture of Red, Green, and Blue color values.
The lowest value that can be given to one of the light sources is 0 (hex 00). The highest value is 255 (hex
FF).
Hex values are written as six-digit numbers, starting with a # sign. Letters used in a hexadecimal digit may
be uppercase or lowercase.
 For example, to specify white color you can write #FFFFFF or #ffffff.
 rgb(red, green, blue)
 Each parameter (red, green, and blue) defines the intensity of the color with a
value between 0 and 255.
 This means that there are 256 x 256 x 256 = 16777216 possible colors!
 For example, rgb(255, 0, 0) is displayed as red, because red is set to its highest
value (255), and the other two (green and blue) are set to 0.
 Another example, rgb(0, 255, 0) is displayed as green, because green is set to its
highest value (255), and the other two (red and blue) are set to 0.
 For example, #ff0000 is displayed as red, because red is set to its highest value
(ff), and the other two (green and blue) are set to 00.
 Another example, #00ff00 is displayed as green, because green is set to its highest
value (ff), and the other two (red and blue) are set to 00.
 To display black, set all color parameters to 00, like this: #000000.
 To display white, set all color parameters to ff, like this: #ffffff.
Example of the background-color property used with the "hex" value:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
div {
background-color: #1c87c9;
color: #d5dce8;
padding: 22px;
}
</style>
</head>
<body>
<div>
<p>This is a text in grey, and the background is blue</p>
</div>
<p style="color:#8ebf42;"> This is a text in green</p>
</body>
Example of the background-color property used with the "RGB" value:

<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
div {
background-color:rgb(25,25,112);
color: rgb(169,169,169);
padding: 22px;
}
</style>
</head>
<body>
<div>
<p>This is a text in grey, and the background is blue</p>
</div>
<p style="color:rgb(25,25,112);"> This is a text in blue</p>
</body>
Lists
Three types of lists in HTML:
 Unordered lists , which are like lists of bullet points
 Ordered lists , which use a sequence of numbers or letters instead of bullet points
 Definition lists , which allow you to specify a term and its definition
Using the < ul > Element to Create Unordered Lists
Example:
< ul >
< li > Bullet point number one < /li >
< li > Bullet point number two < /li >
< li > Bullet point number three < /li >
< /ul >
Ordered list
 In an ordered list, rather than prefixing each point with a bullet point, you can use
either numbers (1, 2, 3), letters (A, B, C), or Roman numerals (i, ii, iii) to prefix
the list item.
 An ordered list is contained inside the < ol > element. Each item in the list should
then be nested inside the < ol > element and contained between opening < li > and
closing < /li > tags.
 Example:
< ol >
< li > Point number one < /li >
< li > Point number two < /li >
< li > Point number three < /li >
< /ol >
Definition list
 Definition lists are contained inside the < dl > element. The < dl > element then
contains alternating < dt > and < dd > elements. The content of the < dt > element
is the term we will be defining. The < dd > element contains the description of the
< dt > element.
 Example
<dl >
< dt > Unordered List < /dt >
< dd > A list of bullet points. < /dd >
< dt > Ordered List < /dt >
< dd > An ordered list of points, such as a numbered set of steps. < /dd >
< dt > Definition List < /dt >
< dd > A list of terms and definitions. < /dd >
< /dl >
Nested list
 Nested list will be numbered separately unless you specify otherwise using the start attribute. And
each new list should be placed inside a < li > element
 Example:
< ol type=”I” >
< li > Item one < /li >
< li > Item two < /li >
< li > Item three < /li >
< li > Item four
< ol type=”i” >
< li > Item 4.1 < /li >
< li > Item 4.2 < /li >
< li > Item 4.3 < /li >
< /ol >
< /li >
Character Entities or Special Characters

Character Numeric Entity Named


Entity
“ & #034;
& quot;
& & #038;
& amp;
< & #060;
& lt;
> & #062;
& gt;
Comments

 We can put comments between any tags in your HTML documents.


Comments use the following
 syntax:
 < !-- comment goes here -- >
 Anything after < ! - - until the closing - - > will not be displayed. It
can still be seen in the source code for the document, but it is not
shown onscreen.
<div> and <span> elements
 The < div > and < span > elements allow you to group several elements to
create sections or subsections of a page.
 The < div > element is used to group block - level elements:
 Example
< div class=”footnotes” >
< h2 > Footnotes < /h2 >
< p > <b>1</b> The World Wide Web was invented by Tim Berners-Lee < /p >
< p > <b>2</b> The W3C is the World Wide Web Consortium which maintains
many Web standards < /p >
< /div >
<span> element
 The < span > element, can be used to group inline elements only.
 Span is used to wrap small portions of text, images etc.
 Example:
<div class=”footnotes” >
< h2 > Footnotes < /h2 >
< p > < span class=”inventor” > < b > 1 < /b > The World Wide Web was invented by
Tim Berners-Lee < /span > < /p >
< p > < b > 2 < /b > The W3C is the World Wide Web Consortium which maintains
many Web standards < /p >
< /div >
Links and navigation
 A link is specified using the < a > element. Anything between the opening < a > tag and the
closing< /a > tag becomes part of the link that users can click in a browser.
 Example:
< body >
< p > Return to the < a href=”index.html” > home page < /a > . < /p >
< /body >
The default color of links in HTML is:
unvisited links: underlined and blue
visited links: underlined and purple
active links: underlined and red
<img> Element
 The < img > element, which has to carry at least two attributes: the src attribute,
indicating the source of the image, and an alt attribute, which provides a description of
the image.
 Syntax:
< img src=”logo.gif” alt=”cvr logo” / >
Tables
 We can create a table in HTML using the < table > element. Inside the < table > element, the
table is written out row by row. A row is contained inside a <tr> element — which stands for
table row .
 Each cell is then written inside the row element using a <td> element — which stands for
table data .
 Each cell must be represented by either a < td > or a < th >(table heading) element in order
for the table to display correctly, even if there is no data in that cell.
 Table rows can be grouped into a head, foot, and body sections through
the <thead>, <tfoot> and <tbody> elements, respectively
 Example:
<table border=”1”><tr><td>Row 1, Column 1</td><td>Row 1, Column 2</td></tr><tr>
<td>Row 2, Column 1</td><td>Row 2, Column 2</td></tr></table>
 The align Attribute (Deprecated)
 Although it is deprecated, the align attribute is still frequently used with tables. When used with the< table >
element, it indicates whether the table should be aligned to the left (the default), right , or center of the page.
 < table align=”center|left|right” >
 Example:
< table border=”1” align=”left” >
< tr >
< td > Row 1, Column 1 < /td >
< td > Row 1, Column 2 < /td >
< /tr >
< tr >
< td > Row 2, Column 1 < /td >
< td > Row 2, Column 2 < /td >
< /tr >
< /table >
Attributes in table
 The bgcolor attribute:bgcolor=”red”
 The Border attribute:border=”0”
 The cellpadding Attribute :The cellpadding attribute is used to create a gap between the edges of a
cell and its contents.
Ex:cellpadding=”5” or cellpadding=”2%”
 The cellspacing Attribute (Deprecated) The cellspacing attribute is used to create a space between
the borders of each cell.
Ex:cellspacing=”6” or cellspacing=”2%”
 The dir Attribute :The dir attribute is supposed to indicate the direction of text that is used in the
table. Possible values are ltr for left to right text and rtl for right to left .
Ex:dir=”rtl”
 The colspan Attribute: The colspan attribute is used when a cell should span across more
than one column. The value of the attribute specifies how many columns of the table a
cell will span across.
Example: colspan=”2”
 The rowspan Attribute: The rowspan attribute specifies the number of rows of the table a
cell will span across, the value of the attribute being the number of rows the cell stretches
across.
Example:rowspan=”2”
 The <colgroup> Element:If two or more columns are related, you can use the < colgroup
> element to explain that those columns are grouped together.
Forms
 An HTML form is a section of a document which contains controls such as text fields, password
fields, checkboxes, radio buttons, submit button, menus etc.
 HTML forms are required if we want to collect some data from the site visitor.
Form Controls. :
 Text input controls
 Buttons
 Checkboxes and radio buttons
 Select boxes (sometimes referred to as drop - down menus and list boxes)
 File select boxes
 Hidden controls
 Text Inputs :Text input boxes are used on many web pages. text input is a box or line in or on
which we must write a response.
 There are three types of text input used on forms:
 Single - line text input controls: Used for items that require only one line of user input, such as
search boxes or e - mail addresses. They are created using the < input > element
 Example:
< form action=”http://www.example.com/search.aspx” method=”get”name=”frmSearch” >
Search:
< input type=”text” name=”txtSearch” value=”Search for” size=”20”
maxlength=”64” / >
< input type=”submit” value=”Submit” / >
< /form >
 Password input controls are mainly used for entering passwords on login forms or sensitive details
such as credit card numbers. They are also created using the < input > element.
 The password input masks the characters the user types on the screen by replacing them with either a
dot or asterisk, so that they would not be visible to someone looking over the user’ s shoulder.
 Example:
< form action=”http://www.example.com/login.aspx” method=”post” >
Username:
< input type=”text” name=”txtUsername” value=”” size=”20” maxlength=”20” / >
< br / >
Password:
< input type=”password” name=”pwdPassword” value=”” size=”20” maxlength=”20” / >
< input type=”submit” value=”Submit” / >
< /form >
 Multi - line text input controls: Used when the user is required to give details that may be
longer than a single sentence. Multi - line input controls are created with the < textarea >
element.
 Example
< form action=”http://www.example.org/feedback.aspx” method=”post” >
Please tell us what you think of the site and then click submit: < br / >
< textarea name=”txtFeedback” rows=”20” cols=”50” >
Enter your feedback here.
< /textarea >
< br / >
< input type=”submit” value=”Submit” / >
< /form >
 Buttons are most commonly used to submit a form, although they are sometimes used to clear or reset a
form and even to trigger client - side scripts
 The type attribute can take the following values to create a button:
 submit , which creates a button that submits a form when pressed
 reset , which creates a button that automatically resets form controls to their initial values as
they were when the page loaded
 button , which creates a button that is used to trigger a client - side script when the user clicks
that button
Example :
< input type=”submit” name=”btnVoteRed” value=”Vote for reds” / >
< input type=”submit” name=”btnVoteBlue” value=”Vote for blues” / >
< br / > < br / >
< input type=”reset” value=”Clear form” / > < br / > < br / >
< input type=”button” value=”calculate” onclick=”calculate()” / >
 Using Images for Buttons: We can use an image for a button rather than using the standard button that
a browser renders. Creating an image button is very similar to creating any other button, but the type
attribute has a value of image :
 < input type=”image” src=”submit.jpg” alt=”Submit” name=”btnImage” / >
Attribute Purpose
src
Specifies the source of the image file.

alt

Provides alternative text for the image. This

will be displayed when the image cannot

found and also read to people using voice

browsers.
 Creating Buttons Using the < button > Element The < button > element is a more recent introduction that allows you to
specify what appears on a button between an opening < button > tag and a closing < /button > tag
 Example:
< button type=”submit” > Submit < /button >
< br / > < br / >
< button type=”reset” ><b> Clear this form ,</b> I want to start again < /button >
< br / > < br / >
< button type=”button” > < img src=”submit.gif” alt=”submit” / > < /button
 Checkboxes :Checkboxes are just like the little boxes on paper forms in which we can place a cross or tick. As with light
switches, they can be either on or off. When they are checked they are on — the user can simply toggle between on and
off positions by clicking the checkbox.
 Example:
< input type=”checkbox” name=”chkSkills” value=”xhtml” / > XHTML < br / >
< input type=”checkbox” name=”chkSkills” value=”CSS” / > CSS < br / >
< input type=”checkbox” name=”chkSkills” value=”JavaScript” / > JavaScript < br / >
< input type=”checkbox” name=”chkSkills” value=”aspnet” / > ASP.Net < br / >
< input type=”checkbox” name=”chkSkills” value=”php” / > PHP
 Radio Button Control When you have a group of radio buttons that share the same
name, only one of them can be selected. Once one radio button has been selected, if the
user clicks another option, the new option is selected and the old one deselected.
 we should not use radio buttons for a single form control where the control indicates on
or off, because once a lone radio button has been selected it cannot be deselected again
 Example:
<form action=”http://www.example.com/flights.aspx” name=”frmFlightBooking”
method=”get” >
Please select which class of travel you wish to fly: < br / >
< input type=”radio” name=”radClass” value=”First” / > First class < br / >
< input type=”radio” name=”radClass” value=”Business” / > Business class < br / >
< input type=”radio” name=”radClass” value=”Economy” / > Economy class < br / >
< /form >
 Select Boxes :A drop - down select box allows users to select one item from a drop -
down menu. Drop - down select boxes can take up far less space than a group of radio
buttons.
 Drop - down select boxes can also provide an alternative to single - line text input
controls where we want to limit the options that a user can enter.
 A drop - down select box is contained by a < select > element, while each individual
option within that list is contained within an < option > element
 Example:
< select name=”selColor” >
< option selected=”selected” value=”” > Select color < /option >
< option value=”red” > Red < /option >
< option value=”green” > Green < /option >
< option value=”blue” > Blue < /option >
< /select >
 File Select Boxes: If we want to allow a user to upload a file to some web site from our computer, we will need to
use a file upload box , also known as a file select box.
 Example:
< form action=”http://www.example.com/imageUpload.aspx” method=”post”
name=”fromImageUpload” enctype=”multipart/form-data” >
< input type=”file” name=”fileUpload” accept=”image/*” / >
< br / > < br / > < input type=”submit” value=”Submit” / >
< /form >
 Hidden Controls :Sometimes we want to pass information between pages without the user seeing it; to do this, we
can use hidden form controls
 Example:
<form action=”http://www.example.com/vote.aspx” method=”get” name=”fromVote” >
< input type=”hidden” name=”hidPageSentFrom” value=”home page” / >
< input type=”submit” value=”Click if this is your favorite page of our
site.” / >
< /form >
 Creating Labels for Controls and the< label > Element: the < label > element carries an attribute called
for , which indicates the form control associated with the label. The value of the for attribute should be
the same as the value of the id attribute on the corresponding form control
 Example:
< form action=”http://www.example.org/login.aspx” method=”post” name=”frmLogin” >
< table >
< tr >
< td > < label for=”Uname” > User name < /label > < /td >
< td > < input type=”text” id=”Uname” name=”txtUserName” / > < /td >
< /tr >
< tr >
< td > < label for=”Pwd” > Password < /label > < /td >
< td > < input type=”password” id=”Pwd” name=”pwdPassword” / > < /td >
< /tr >
< /table >
< /form >
 Structuring Your Forms with < fieldset > and< legend > Elements:The < fieldset > element creates a
border around the group of form controls to show that theyare related.The < legend > element allows you
to specify a caption for the < fieldset > element, which acts as a title for the group of form controls.
 When used, the < legend > element should always be the first child of the < fieldset > element.
 Example:
<form>
<fieldset>
<legend>User Information:</legend>
<label for="name">Enter name</label><br>
<input type="text" id="name" name="name"><br>
<label for="pass">Enter Password</label><br>
<input type="Password" id="pass" name="pass"><br>
<input type="submit" value="submit">
</fieldset>
</form>

You might also like