PHP
HTML-II contd..
Dr. Amar Nath Singh
Professor, CSE Department
1
Web Technology
Outline
• Form Attribute
• File Path
• Types of file path
• Iframe
• Class and id
28-01-2026 Dr. Amar Nath Singh 2
Web Technology
Objectives
1. Learn the HTML and key components like functions, headers, and
syntax.
2. Explore HTML and its various component to design the
interactive layout
3. Gain skills in designing of web pages and enhance the document
visibility.
28-01-2026 Dr. Amar Nath Singh 3
Web Technology
Lecture Structure
05
Outline & Objectives
Minutes
05
Recap of Previous Lecture
Minutes
30 Delivery of Actual Content as per
Minutes Lesson Plan
05
Industry Relevance
Minutes
10
Interactive Activities
Minutes
02
Importance of Discipline
Minutes
03
Recording of Attendance
Minutes
28-01-2026 Dr. Amar Nath Singh 4
Web Technology
Recap of Previous Lecture
1. Basic Structure of HTML document.
2. About the Paired and Unpaired Tag
3. Logical thinking to create the layout.
4. Familiarity with the subcomponents in HTML.
28-01-2026 Dr. Amar Nath Singh 5
Web Technology
Form Attribute
• Name
• Value
• Required
• autofocus
• Placeholder
• Disables
• Size
• form
28-01-2026 Dr. Amar Nath Singh 6
Web Technology
Layout OF HTML
28-01-2026 Dr. Amar Nath Singh 7
Web Technology
Contd..
Header: It is used to define a header for a document or a section
Nav: It is used to define a container for a navigation link
Section: It is used to define section in a document
Article: It is used to define an independent self-contained article
Aside: It is used to define content aside from the content
Footer: It is used to define a footer for a document or a section
28-01-2026 Dr. Amar Nath Singh 8
Web Technology
File Path
• An HTML File Path is used to describe the location of a file in a website
folder.
• It is use to link image file, CSS file, Js file ,video etc..
• Attribute: Src
• Ex:
<img src=‘[Link]’>
<img src=“images/[Link]”>
<img src=“../[Link]”>
28-01-2026 Dr. Amar Nath Singh 9
Web Technology
Types of File Path
• Absolute File Path
Absolute file Path specifies full URL address.
<img src=“ url of image”>
• Relative File Path
<img src=“[Link]”>
28-01-2026 Dr. Amar Nath Singh 10
Web Technology
Types of IFrame
HTML iframe is used to display a nested webpage (a webpage within
webpage). Used to embed webpage or a YouTube video.
<iframe src=“URL”></iframe>
Attributes:
Src
width
height
frameborder
allowfullscreen
28-01-2026 Dr. Amar Nath Singh 11
Web Technology
Classes and ID
The HTML class attribute is used to specify a class for an HTML elements
Multiple HTML elements can share same class.
The class attribute is often used to point a class name in a style sheet.
To create a class; write a period (.) character, followed by a class name.
Then, define the CSS properties within curly braces {}:
The HTML id attribute is used to specify a unique .
You cannot have more than one element with the same id in an HTML
document
The syntax for id is: write a hash character (#), followed by an id name.
Then, define the CSS properties within curly braces {}.
28-01-2026 Dr. Amar Nath Singh 12
Web Technology
Audio and Video
HTML audio tag is used to define sounds such as music and
other audio clips
Currently there three supported file format for HTML audio tag.
Mp3
Wav
Ogg
HTML5 supports <video> and <audio> controls
<audio controls>
<source src=“” type=“audio/mpeg”>
</audio>
28-01-2026 Dr. Amar Nath Singh 13
Web Technology
Connecting to real world scenario
1. SIZE: Sets the size of the text, takes value between 1 and 7, default is 3.
Size can also be set relative to default size
for example; SIZE=+X, where X is any integer value and it will add with the
default size.
Example:
<FONT SIZE=5> Font Size changes to 5 </FONT>
2. FACE: Sets the normal font type, provided it is installed on the user’s
machine.
Example:
<FONT FACE="ARIAL"> the text will be displayed in Arial</FONT>
28-01-2026 Dr. Amar Nath Singh 14
Web Technology
Interactive Activities
1. create a HTML page, which has properly aligned
paragraphs with image, display list of items in
different styles .
2. various text formatting tags available in
HTML.(i.e.<h1>,<b>,<u> etc…), special characters.
3. Create a
HTML file which displays 3 images at LEFT, RIGHT
and CENTER
respectively in the browser.
28-01-2026 Dr. Amar Nath Singh 15
Web Technology
Discipline Guidelines
• DCS & GSFCU Portal: Remind students to use DCS, talk about it’s features and instruct all to visit GSFCU website
• Discipline, Values and Ethics.
• GSFC University – My University: Emphasize the importance of taking ownership of the University.
• Respect & Courtesy: Remind students to be respectful to peers, teachers, and staff. Encourage polite language
and behavior.
• Punctuality: Emphasize the importance of arriving on time to class and completing assignments by deadlines.
• Classroom Rules: Reinforce basic classroom rules, such as keeping mobile phones on silent and maintaining a
clean environment.
• Safety: Remind students about safety protocols, whether it's physical safety in the classroom or digital safety when
using online resources.
• Positive Attitude: Encourage a positive mindset, cooperation and supporting one another.
28-01-2026 Dr. Amar Nath Singh 16
Web Technology
GSFCU & Values
Respect & Courtesy
28-01-2026 Dr. Amar Nath Singh 17
Thank You..
28-01-2026 Dr. Amar Nath Singh 18