SlideShare a Scribd company logo
Web Forms and
HTML
Sam
Lecture-2
The <img>
• Images are very important to beautify as well as to depicts many concepts on your web page.
• Its is true that one single image is worth than thousands of words.
• Syntax:
• <img src="image URL" attr_name="attr_value"...more attributes />
• Following are most frequently used attributes for <img> tag.
• width: sets width of the image. This will have a value like 10 or 20%etc.
• height: sets height of the image. This will have a value like 10 or 20% etc.
• border: sets a border around the image. This will have a value like 1 or 2 etc.
• src: specifies URL of the image file.
• alt: this is an alternate text which will be displayed if image is missing.
• align: this sets horizontal alignment of the image and takes value either left, right orcenter.
• valign: this sets vertical alignment of the image and takes value either top, bottom orcenter.
• hspace: horizontal space around the image. This will have a value like 10 or 20%etc.
• vspace: vertical space around the image. This will have a value like 10 or 20%etc.
• name: name of the image with in the document.
• id: id of the image with in the document.
• style: this will be used if you are using CSS.
• title: specifies a text title. The browser, perhaps flashing the title when the mouse passes over the link.
• Example:
• <img src=" img.jpg" alt=" Image1" />
Links
• The web got its spidery name from the plentiful connections between web sites.
• These connections are made using anchor tags to create links. Text, Images.
• We Can have three types of links
1. Internal - Links to anchors on the current page
2. Local - Links to other pages within your domain
3. Global - Links to other domains outside of your site
• The “href “ attribute uses to link. See examples below.
• Examples:
<!– Example of intrernal -->
<a name=“title”> This is my title</a>
<a href=“#title”>Go to Title</a>
<!– Example of local -->
<a href=“page2.html”>Page2</a>
<!– Example of Global -->
<a href=“www.hidaya.org”>Hidaya Foundation</a>
HTML Email Tag:
• HTML <a> tag provides you facility to specifiy an email address to send an email.
• Example:
• <a href= "mailto:abc@example.com">Send Email</a>
Assignments
• Create a page consisting of :
• Table of content for 5-6 topics.
• Make topics with h1 as heading and below its description in paragraph.
• Make a "References" section with minimum 3 links.
• Link references to another pages (other websites) within certain content.
• Create a page consisting of:
• 2 to 3 links to other page
• The other page has descriptions of all links to which the link has to point
out
Questions
?
Questions
?

More Related Content

PPTX
HTML Images
PPTX
uptu web technology unit 2 Css
PPTX
Html images and html backgrounds
PPTX
uptu web technology unit 2 Css
PDF
Introduction to web – human body analogy
PPTX
uptu web technology unit 2 html
PPT
Class1
PPTX
Designing web page marquee and img tag
HTML Images
uptu web technology unit 2 Css
Html images and html backgrounds
uptu web technology unit 2 Css
Introduction to web – human body analogy
uptu web technology unit 2 html
Class1
Designing web page marquee and img tag

What's hot (17)

TXT
Seo hints
PPTX
PPTX
HTML Lists & Llinks
PPTX
Html tag presentation
PDF
HTML & CSS Basics
PDF
Scaling Complexity in WordPress Enterprise Apps
PPTX
uptu web technology unit 2 html
PPTX
Optimizing Your Tendenci Site for SEO | SEO for CMS
PDF
Styling with CSS
PPTX
Themes
PPTX
How to make a website
PPSX
Steph's Html5 and css presentation
PPT
2. html attributes
PPT
Easy Guide to WordPress Theme Integration
PDF
Intro to HTML, CSS & JS - Internship Presentation Week-3
PDF
An Intro to HTML & CSS
PPTX
Introduction to HTML and CSS
Seo hints
HTML Lists & Llinks
Html tag presentation
HTML & CSS Basics
Scaling Complexity in WordPress Enterprise Apps
uptu web technology unit 2 html
Optimizing Your Tendenci Site for SEO | SEO for CMS
Styling with CSS
Themes
How to make a website
Steph's Html5 and css presentation
2. html attributes
Easy Guide to WordPress Theme Integration
Intro to HTML, CSS & JS - Internship Presentation Week-3
An Intro to HTML & CSS
Introduction to HTML and CSS
Ad

Similar to Web forms and html (lect 2) (20)

PPTX
More on HTML Communication Skills BASICS
PPTX
Images and Lists in HTML
PPT
Web forms and html lecture Number 2
PPTX
Simple Presentation in Pink Lilac Pastel Blobs Basic Style.pptx.pptx
PPTX
website-development Hyper Text Markup Language.pptx
PDF
"Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin...
PPT
frames
PPT
Ashish
PPT
Hyperlink.85 to 86
PPTX
Frontend Devlopment internship batch 2024.pptx
PPTX
Frontend Devlopment internship batch 2024-2.pptx
PPT
Web technology
PPTX
HTML Coding
PPTX
HTML introduction for beginners Slides .pptx
PDF
Thinkful - Frontend Crash Course - Intro to HTML/CSS
PPTX
Introduction to HTML: The Building Block of the Web by Infinite Web Solutions...
PDF
Understanding HTML: Creating Text Links for Navigation and Image Links for In...
PDF
Intro to HTML 5 / CSS 3
PPTX
CSS3 basics for beginners - Imrokraft
PPTX
Full Stack_HTML- Hypertext Markup Language
More on HTML Communication Skills BASICS
Images and Lists in HTML
Web forms and html lecture Number 2
Simple Presentation in Pink Lilac Pastel Blobs Basic Style.pptx.pptx
website-development Hyper Text Markup Language.pptx
"Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin...
frames
Ashish
Hyperlink.85 to 86
Frontend Devlopment internship batch 2024.pptx
Frontend Devlopment internship batch 2024-2.pptx
Web technology
HTML Coding
HTML introduction for beginners Slides .pptx
Thinkful - Frontend Crash Course - Intro to HTML/CSS
Introduction to HTML: The Building Block of the Web by Infinite Web Solutions...
Understanding HTML: Creating Text Links for Navigation and Image Links for In...
Intro to HTML 5 / CSS 3
CSS3 basics for beginners - Imrokraft
Full Stack_HTML- Hypertext Markup Language
Ad

More from Salman Memon (20)

PPTX
PHP Array very Easy Demo
PPTX
Complete Lecture on Css presentation
PPTX
How to Use Dreamweaver cs6
PPTX
what is programming and its clear Concepts to the point
PPTX
Working with variables in PHP
PPT
Web forms and html (lect 5)
PPT
Web forms and html (lect 4)
PPT
Web forms and html (lect 3)
PPT
Web forms and html (lect 1)
PPT
Managing in the Future Enterprise
PPT
Overview of Technology Management
PPT
Align Information Technology and Business Strategy
PPTX
WHITE BOX & BLACK BOX TESTING IN DATABASE
PPTX
Email security netwroking
PPTX
Email security - Netwroking
PPTX
Query decomposition in data base
PPTX
Time Management
PPTX
Multimedea device and routes
PPTX
Hash function
PPTX
Data clustring
PHP Array very Easy Demo
Complete Lecture on Css presentation
How to Use Dreamweaver cs6
what is programming and its clear Concepts to the point
Working with variables in PHP
Web forms and html (lect 5)
Web forms and html (lect 4)
Web forms and html (lect 3)
Web forms and html (lect 1)
Managing in the Future Enterprise
Overview of Technology Management
Align Information Technology and Business Strategy
WHITE BOX & BLACK BOX TESTING IN DATABASE
Email security netwroking
Email security - Netwroking
Query decomposition in data base
Time Management
Multimedea device and routes
Hash function
Data clustring

Recently uploaded (20)

PPTX
1st Inaugural Professorial Lecture held on 19th February 2020 (Governance and...
PDF
102 student loan defaulters named and shamed – Is someone you know on the list?
PDF
RMMM.pdf make it easy to upload and study
PDF
01-Introduction-to-Information-Management.pdf
PDF
The Lost Whites of Pakistan by Jahanzaib Mughal.pdf
PDF
Microbial disease of the cardiovascular and lymphatic systems
PDF
3rd Neelam Sanjeevareddy Memorial Lecture.pdf
PPTX
Pharma ospi slides which help in ospi learning
PDF
Module 4: Burden of Disease Tutorial Slides S2 2025
PPTX
Pharmacology of Heart Failure /Pharmacotherapy of CHF
PPTX
master seminar digital applications in india
PDF
Classroom Observation Tools for Teachers
PPTX
Final Presentation General Medicine 03-08-2024.pptx
PDF
Chapter 2 Heredity, Prenatal Development, and Birth.pdf
PDF
A GUIDE TO GENETICS FOR UNDERGRADUATE MEDICAL STUDENTS
PDF
Supply Chain Operations Speaking Notes -ICLT Program
PDF
grade 11-chemistry_fetena_net_5883.pdf teacher guide for all student
PPTX
human mycosis Human fungal infections are called human mycosis..pptx
PDF
Abdominal Access Techniques with Prof. Dr. R K Mishra
PDF
ANTIBIOTICS.pptx.pdf………………… xxxxxxxxxxxxx
1st Inaugural Professorial Lecture held on 19th February 2020 (Governance and...
102 student loan defaulters named and shamed – Is someone you know on the list?
RMMM.pdf make it easy to upload and study
01-Introduction-to-Information-Management.pdf
The Lost Whites of Pakistan by Jahanzaib Mughal.pdf
Microbial disease of the cardiovascular and lymphatic systems
3rd Neelam Sanjeevareddy Memorial Lecture.pdf
Pharma ospi slides which help in ospi learning
Module 4: Burden of Disease Tutorial Slides S2 2025
Pharmacology of Heart Failure /Pharmacotherapy of CHF
master seminar digital applications in india
Classroom Observation Tools for Teachers
Final Presentation General Medicine 03-08-2024.pptx
Chapter 2 Heredity, Prenatal Development, and Birth.pdf
A GUIDE TO GENETICS FOR UNDERGRADUATE MEDICAL STUDENTS
Supply Chain Operations Speaking Notes -ICLT Program
grade 11-chemistry_fetena_net_5883.pdf teacher guide for all student
human mycosis Human fungal infections are called human mycosis..pptx
Abdominal Access Techniques with Prof. Dr. R K Mishra
ANTIBIOTICS.pptx.pdf………………… xxxxxxxxxxxxx

Web forms and html (lect 2)

  • 3. The <img> • Images are very important to beautify as well as to depicts many concepts on your web page. • Its is true that one single image is worth than thousands of words. • Syntax: • <img src="image URL" attr_name="attr_value"...more attributes /> • Following are most frequently used attributes for <img> tag. • width: sets width of the image. This will have a value like 10 or 20%etc. • height: sets height of the image. This will have a value like 10 or 20% etc. • border: sets a border around the image. This will have a value like 1 or 2 etc. • src: specifies URL of the image file. • alt: this is an alternate text which will be displayed if image is missing. • align: this sets horizontal alignment of the image and takes value either left, right orcenter. • valign: this sets vertical alignment of the image and takes value either top, bottom orcenter. • hspace: horizontal space around the image. This will have a value like 10 or 20%etc. • vspace: vertical space around the image. This will have a value like 10 or 20%etc. • name: name of the image with in the document. • id: id of the image with in the document. • style: this will be used if you are using CSS. • title: specifies a text title. The browser, perhaps flashing the title when the mouse passes over the link. • Example: • <img src=" img.jpg" alt=" Image1" />
  • 4. Links • The web got its spidery name from the plentiful connections between web sites. • These connections are made using anchor tags to create links. Text, Images. • We Can have three types of links 1. Internal - Links to anchors on the current page 2. Local - Links to other pages within your domain 3. Global - Links to other domains outside of your site • The “href “ attribute uses to link. See examples below. • Examples: <!– Example of intrernal --> <a name=“title”> This is my title</a> <a href=“#title”>Go to Title</a> <!– Example of local --> <a href=“page2.html”>Page2</a> <!– Example of Global --> <a href=“www.hidaya.org”>Hidaya Foundation</a> HTML Email Tag: • HTML <a> tag provides you facility to specifiy an email address to send an email. • Example: • <a href= "mailto:abc@example.com">Send Email</a>
  • 5. Assignments • Create a page consisting of : • Table of content for 5-6 topics. • Make topics with h1 as heading and below its description in paragraph. • Make a "References" section with minimum 3 links. • Link references to another pages (other websites) within certain content. • Create a page consisting of: • 2 to 3 links to other page • The other page has descriptions of all links to which the link has to point out