SlideShare ist ein Scribd-Unternehmen logo
1 von 8
Downloaden Sie, um offline zu lesen
HTML HYPERLINK
<a>......</a>
HTML IMAGES
<img src=“image.jpg">
Class: FY B. Tech Structural Engineering
Subject: IT for Engineers Prof. Jape Anuja Sanjay
Assistant Professor,
Department of Structural Engineering,
Sanjivani College of Engineering. Kopargaon
Email: japeanujast@sanjivani.org.in
HTML Links - Hyperlinks
• HTML links are hyperlinks.
• You can click on a link and jump to another
document/link/page.
• When you move the mouse over a link, the
mouse arrow will turn into a little hand.
• A link does not have to be text. A link can be an
image or any other HTML element.
• The HTML <a> tag defines a hyperlink. It has the
following syntax
<a href="url">link text</a>
Ref:https://www.w3schools.com/
HTML Links - The target Attribute
• By default, the linked page will be displayed in the
current browser window. To change this, you must
specify another target for the link.
• The target attribute specifies where to open the linked
document.
• The target attribute can have one of the following
values:
_self - Default. Opens the document in the same
window/tab as it was clicked
_blank - Opens the document in a new window or tab
_parent - Opens the document in the parent frame
_top - Opens the document in the full body of the window
Ref:https://www.w3schools.com/
HTML Links - Use an Image as a Link
To use an image as a link, just put the <img> tag
inside the <a> tag:
<a href=“url"> <img src=“img.jpg" alt=“alternate text”
style="width:32px;height:32px;"> </a>
Ref:https://www.w3schools.com/
Link to an Email Address
<p>
<a href="mailto:someone@example.com">Send email</a>
</p>
Button as a Link
• To use an HTML button as a link, you have to add some
JavaScript code.
• JavaScript allows you to specify what happens at
certain events, such as a click of a button.
<button onclick="document.location='default.asp'">HTML
Tutorial</button> Ref:https://www.w3schools.com/
Link Titles
The title attribute specifies extra information about an
element. The information is most often shown as a tooltip
text when the mouse moves over the element.
<a href="url" title="hello">Visit our Page</a>
Ref:https://www.w3schools.com/
HTML Images
• Images can improve the design and the appearance of a web
page.
• The HTML <img> tag is used to embed an image in a web page.
• Images are not technically inserted into a web page; images
are linked to web pages. The <img> tag creates a holding space
for the referenced image.
• The <img> tag is empty, it contains attributes only, and does not
have a closing tag.
• The <img> tag has two required attributes:
•src - Specifies the path to the image
•alt - Specifies an alternate text for the image
<img src="url" alt="alternatetext">
Ref:https://www.w3schools.com/
•Use the HTML <img> element to define an image
•Use the HTML src attribute to define the URL of the image
•Use the HTML alt attribute to define an alternate text for an image, if it cannot be displayed
•Use the HTML width and height attributes or the CSS width and height properties to define the size
of the image
•Use the CSS float property to let the image float to the left or to the right
Ref:https://www.w3schools.com/

Weitere ähnliche Inhalte

Ähnlich wie What is HTML Hyperlinks and HTML Images?

HTML : INTRODUCTION TO WEB DESIGN Presentation
HTML : INTRODUCTION TO WEB DESIGN PresentationHTML : INTRODUCTION TO WEB DESIGN Presentation
HTML : INTRODUCTION TO WEB DESIGN Presentationsurajsutar467
 
HTML introduction for beginners Slides .pptx
HTML introduction for beginners Slides .pptxHTML introduction for beginners Slides .pptx
HTML introduction for beginners Slides .pptxwewit44414
 
Web forms and html (lect 2)
Web forms and html (lect 2)Web forms and html (lect 2)
Web forms and html (lect 2)Salman Memon
 
gdsc-html-ppt.pptx
gdsc-html-ppt.pptxgdsc-html-ppt.pptx
gdsc-html-ppt.pptxyuvakiran15
 
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvvLecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvvZahouAmel1
 
Web Development 3 (HTML & CSS)
Web Development 3  (HTML & CSS)Web Development 3  (HTML & CSS)
Web Development 3 (HTML & CSS)ghayour abbas
 
HTML Attributes.pptx
HTML Attributes.pptxHTML Attributes.pptx
HTML Attributes.pptxSteins18
 
Html for beginners part II
Html for beginners part IIHtml for beginners part II
Html for beginners part IIUnaib Aslam
 
Introduction to HTML.pptx
Introduction to HTML.pptxIntroduction to HTML.pptx
Introduction to HTML.pptxmalrad1
 
Blog creationguide forestview
Blog creationguide forestviewBlog creationguide forestview
Blog creationguide forestviewNikos Stagakis
 
Images and Lists in HTML
Images and Lists in HTMLImages and Lists in HTML
Images and Lists in HTMLMarlon Jamera
 
Understanding the Web Page Layout
Understanding the Web Page LayoutUnderstanding the Web Page Layout
Understanding the Web Page LayoutJhaun Paul Enriquez
 
MTA html5 text_graphics_media
MTA html5 text_graphics_mediaMTA html5 text_graphics_media
MTA html5 text_graphics_mediaDhairya Joshi
 
LS2.1_V1_HTML.pptx
LS2.1_V1_HTML.pptxLS2.1_V1_HTML.pptx
LS2.1_V1_HTML.pptxLokeshS94
 
2_Meta_Images_Link.ppt
2_Meta_Images_Link.ppt2_Meta_Images_Link.ppt
2_Meta_Images_Link.pptbenjaminonum1
 
SEO Training in Mahabubnagar
SEO Training in MahabubnagarSEO Training in Mahabubnagar
SEO Training in MahabubnagarSubhash Malgam
 

Ähnlich wie What is HTML Hyperlinks and HTML Images? (20)

BASIC HTML
BASIC HTMLBASIC HTML
BASIC HTML
 
html
htmlhtml
html
 
HTML : INTRODUCTION TO WEB DESIGN Presentation
HTML : INTRODUCTION TO WEB DESIGN PresentationHTML : INTRODUCTION TO WEB DESIGN Presentation
HTML : INTRODUCTION TO WEB DESIGN Presentation
 
HTML introduction for beginners Slides .pptx
HTML introduction for beginners Slides .pptxHTML introduction for beginners Slides .pptx
HTML introduction for beginners Slides .pptx
 
Web forms and html (lect 2)
Web forms and html (lect 2)Web forms and html (lect 2)
Web forms and html (lect 2)
 
gdsc-html-ppt.pptx
gdsc-html-ppt.pptxgdsc-html-ppt.pptx
gdsc-html-ppt.pptx
 
Week 6 Lecture
Week 6 LectureWeek 6 Lecture
Week 6 Lecture
 
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvvLecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
 
Web Development 3 (HTML & CSS)
Web Development 3  (HTML & CSS)Web Development 3  (HTML & CSS)
Web Development 3 (HTML & CSS)
 
HTML Attributes.pptx
HTML Attributes.pptxHTML Attributes.pptx
HTML Attributes.pptx
 
Chapter 2.pdf
Chapter 2.pdfChapter 2.pdf
Chapter 2.pdf
 
Html for beginners part II
Html for beginners part IIHtml for beginners part II
Html for beginners part II
 
Introduction to HTML.pptx
Introduction to HTML.pptxIntroduction to HTML.pptx
Introduction to HTML.pptx
 
Blog creationguide forestview
Blog creationguide forestviewBlog creationguide forestview
Blog creationguide forestview
 
Images and Lists in HTML
Images and Lists in HTMLImages and Lists in HTML
Images and Lists in HTML
 
Understanding the Web Page Layout
Understanding the Web Page LayoutUnderstanding the Web Page Layout
Understanding the Web Page Layout
 
MTA html5 text_graphics_media
MTA html5 text_graphics_mediaMTA html5 text_graphics_media
MTA html5 text_graphics_media
 
LS2.1_V1_HTML.pptx
LS2.1_V1_HTML.pptxLS2.1_V1_HTML.pptx
LS2.1_V1_HTML.pptx
 
2_Meta_Images_Link.ppt
2_Meta_Images_Link.ppt2_Meta_Images_Link.ppt
2_Meta_Images_Link.ppt
 
SEO Training in Mahabubnagar
SEO Training in MahabubnagarSEO Training in Mahabubnagar
SEO Training in Mahabubnagar
 

Mehr von AnujaJape2

How to add table using HTML? HTML table styles.
How to add table using HTML? HTML table styles.How to add table using HTML? HTML table styles.
How to add table using HTML? HTML table styles.AnujaJape2
 
3 HTML attributes, style,format,quo,cit.pdf
3 HTML attributes, style,format,quo,cit.pdf3 HTML attributes, style,format,quo,cit.pdf
3 HTML attributes, style,format,quo,cit.pdfAnujaJape2
 
HTML? What is Hyper Text Mark Up Language
HTML? What is Hyper Text Mark Up  LanguageHTML? What is Hyper Text Mark Up  Language
HTML? What is Hyper Text Mark Up LanguageAnujaJape2
 
CEM_Unit-I_Lecture Notes.pdf
CEM_Unit-I_Lecture Notes.pdfCEM_Unit-I_Lecture Notes.pdf
CEM_Unit-I_Lecture Notes.pdfAnujaJape2
 
CEM_Unit-II_Lecture Notes.pdf
CEM_Unit-II_Lecture Notes.pdfCEM_Unit-II_Lecture Notes.pdf
CEM_Unit-II_Lecture Notes.pdfAnujaJape2
 
Brick information.pptx
Brick information.pptxBrick information.pptx
Brick information.pptxAnujaJape2
 

Mehr von AnujaJape2 (6)

How to add table using HTML? HTML table styles.
How to add table using HTML? HTML table styles.How to add table using HTML? HTML table styles.
How to add table using HTML? HTML table styles.
 
3 HTML attributes, style,format,quo,cit.pdf
3 HTML attributes, style,format,quo,cit.pdf3 HTML attributes, style,format,quo,cit.pdf
3 HTML attributes, style,format,quo,cit.pdf
 
HTML? What is Hyper Text Mark Up Language
HTML? What is Hyper Text Mark Up  LanguageHTML? What is Hyper Text Mark Up  Language
HTML? What is Hyper Text Mark Up Language
 
CEM_Unit-I_Lecture Notes.pdf
CEM_Unit-I_Lecture Notes.pdfCEM_Unit-I_Lecture Notes.pdf
CEM_Unit-I_Lecture Notes.pdf
 
CEM_Unit-II_Lecture Notes.pdf
CEM_Unit-II_Lecture Notes.pdfCEM_Unit-II_Lecture Notes.pdf
CEM_Unit-II_Lecture Notes.pdf
 
Brick information.pptx
Brick information.pptxBrick information.pptx
Brick information.pptx
 

Kürzlich hochgeladen

KubeKraft presentation @CloudNativeHooghly
KubeKraft presentation @CloudNativeHooghlyKubeKraft presentation @CloudNativeHooghly
KubeKraft presentation @CloudNativeHooghlysanyuktamishra911
 
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...SUHANI PANDEY
 
FULL ENJOY Call Girls In Mahipalpur Delhi Contact Us 8377877756
FULL ENJOY Call Girls In Mahipalpur Delhi Contact Us 8377877756FULL ENJOY Call Girls In Mahipalpur Delhi Contact Us 8377877756
FULL ENJOY Call Girls In Mahipalpur Delhi Contact Us 8377877756dollysharma2066
 
UNIT-III FMM. DIMENSIONAL ANALYSIS
UNIT-III FMM.        DIMENSIONAL ANALYSISUNIT-III FMM.        DIMENSIONAL ANALYSIS
UNIT-III FMM. DIMENSIONAL ANALYSISrknatarajan
 
UNIT-II FMM-Flow Through Circular Conduits
UNIT-II FMM-Flow Through Circular ConduitsUNIT-II FMM-Flow Through Circular Conduits
UNIT-II FMM-Flow Through Circular Conduitsrknatarajan
 
Generative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPTGenerative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPTbhaskargani46
 
Thermal Engineering -unit - III & IV.ppt
Thermal Engineering -unit - III & IV.pptThermal Engineering -unit - III & IV.ppt
Thermal Engineering -unit - III & IV.pptDineshKumar4165
 
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...ranjana rawat
 
AKTU Computer Networks notes --- Unit 3.pdf
AKTU Computer Networks notes ---  Unit 3.pdfAKTU Computer Networks notes ---  Unit 3.pdf
AKTU Computer Networks notes --- Unit 3.pdfankushspencer015
 
Coefficient of Thermal Expansion and their Importance.pptx
Coefficient of Thermal Expansion and their Importance.pptxCoefficient of Thermal Expansion and their Importance.pptx
Coefficient of Thermal Expansion and their Importance.pptxAsutosh Ranjan
 
Call for Papers - International Journal of Intelligent Systems and Applicatio...
Call for Papers - International Journal of Intelligent Systems and Applicatio...Call for Papers - International Journal of Intelligent Systems and Applicatio...
Call for Papers - International Journal of Intelligent Systems and Applicatio...Christo Ananth
 
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELLPVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELLManishPatel169454
 
ONLINE FOOD ORDER SYSTEM PROJECT REPORT.pdf
ONLINE FOOD ORDER SYSTEM PROJECT REPORT.pdfONLINE FOOD ORDER SYSTEM PROJECT REPORT.pdf
ONLINE FOOD ORDER SYSTEM PROJECT REPORT.pdfKamal Acharya
 
Double rodded leveling 1 pdf activity 01
Double rodded leveling 1 pdf activity 01Double rodded leveling 1 pdf activity 01
Double rodded leveling 1 pdf activity 01KreezheaRecto
 
data_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfdata_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfJiananWang21
 

Kürzlich hochgeladen (20)

KubeKraft presentation @CloudNativeHooghly
KubeKraft presentation @CloudNativeHooghlyKubeKraft presentation @CloudNativeHooghly
KubeKraft presentation @CloudNativeHooghly
 
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
 
FULL ENJOY Call Girls In Mahipalpur Delhi Contact Us 8377877756
FULL ENJOY Call Girls In Mahipalpur Delhi Contact Us 8377877756FULL ENJOY Call Girls In Mahipalpur Delhi Contact Us 8377877756
FULL ENJOY Call Girls In Mahipalpur Delhi Contact Us 8377877756
 
UNIT-III FMM. DIMENSIONAL ANALYSIS
UNIT-III FMM.        DIMENSIONAL ANALYSISUNIT-III FMM.        DIMENSIONAL ANALYSIS
UNIT-III FMM. DIMENSIONAL ANALYSIS
 
UNIT-II FMM-Flow Through Circular Conduits
UNIT-II FMM-Flow Through Circular ConduitsUNIT-II FMM-Flow Through Circular Conduits
UNIT-II FMM-Flow Through Circular Conduits
 
Call Girls in Ramesh Nagar Delhi 💯 Call Us 🔝9953056974 🔝 Escort Service
Call Girls in Ramesh Nagar Delhi 💯 Call Us 🔝9953056974 🔝 Escort ServiceCall Girls in Ramesh Nagar Delhi 💯 Call Us 🔝9953056974 🔝 Escort Service
Call Girls in Ramesh Nagar Delhi 💯 Call Us 🔝9953056974 🔝 Escort Service
 
Generative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPTGenerative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPT
 
Roadmap to Membership of RICS - Pathways and Routes
Roadmap to Membership of RICS - Pathways and RoutesRoadmap to Membership of RICS - Pathways and Routes
Roadmap to Membership of RICS - Pathways and Routes
 
Thermal Engineering -unit - III & IV.ppt
Thermal Engineering -unit - III & IV.pptThermal Engineering -unit - III & IV.ppt
Thermal Engineering -unit - III & IV.ppt
 
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
 
AKTU Computer Networks notes --- Unit 3.pdf
AKTU Computer Networks notes ---  Unit 3.pdfAKTU Computer Networks notes ---  Unit 3.pdf
AKTU Computer Networks notes --- Unit 3.pdf
 
Coefficient of Thermal Expansion and their Importance.pptx
Coefficient of Thermal Expansion and their Importance.pptxCoefficient of Thermal Expansion and their Importance.pptx
Coefficient of Thermal Expansion and their Importance.pptx
 
(INDIRA) Call Girl Meerut Call Now 8617697112 Meerut Escorts 24x7
(INDIRA) Call Girl Meerut Call Now 8617697112 Meerut Escorts 24x7(INDIRA) Call Girl Meerut Call Now 8617697112 Meerut Escorts 24x7
(INDIRA) Call Girl Meerut Call Now 8617697112 Meerut Escorts 24x7
 
Water Industry Process Automation & Control Monthly - April 2024
Water Industry Process Automation & Control Monthly - April 2024Water Industry Process Automation & Control Monthly - April 2024
Water Industry Process Automation & Control Monthly - April 2024
 
Call for Papers - International Journal of Intelligent Systems and Applicatio...
Call for Papers - International Journal of Intelligent Systems and Applicatio...Call for Papers - International Journal of Intelligent Systems and Applicatio...
Call for Papers - International Journal of Intelligent Systems and Applicatio...
 
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELLPVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
 
(INDIRA) Call Girl Aurangabad Call Now 8617697112 Aurangabad Escorts 24x7
(INDIRA) Call Girl Aurangabad Call Now 8617697112 Aurangabad Escorts 24x7(INDIRA) Call Girl Aurangabad Call Now 8617697112 Aurangabad Escorts 24x7
(INDIRA) Call Girl Aurangabad Call Now 8617697112 Aurangabad Escorts 24x7
 
ONLINE FOOD ORDER SYSTEM PROJECT REPORT.pdf
ONLINE FOOD ORDER SYSTEM PROJECT REPORT.pdfONLINE FOOD ORDER SYSTEM PROJECT REPORT.pdf
ONLINE FOOD ORDER SYSTEM PROJECT REPORT.pdf
 
Double rodded leveling 1 pdf activity 01
Double rodded leveling 1 pdf activity 01Double rodded leveling 1 pdf activity 01
Double rodded leveling 1 pdf activity 01
 
data_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfdata_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdf
 

What is HTML Hyperlinks and HTML Images?

  • 1. HTML HYPERLINK <a>......</a> HTML IMAGES <img src=“image.jpg"> Class: FY B. Tech Structural Engineering Subject: IT for Engineers Prof. Jape Anuja Sanjay Assistant Professor, Department of Structural Engineering, Sanjivani College of Engineering. Kopargaon Email: japeanujast@sanjivani.org.in
  • 2. HTML Links - Hyperlinks • HTML links are hyperlinks. • You can click on a link and jump to another document/link/page. • When you move the mouse over a link, the mouse arrow will turn into a little hand. • A link does not have to be text. A link can be an image or any other HTML element. • The HTML <a> tag defines a hyperlink. It has the following syntax <a href="url">link text</a> Ref:https://www.w3schools.com/
  • 3. HTML Links - The target Attribute • By default, the linked page will be displayed in the current browser window. To change this, you must specify another target for the link. • The target attribute specifies where to open the linked document. • The target attribute can have one of the following values: _self - Default. Opens the document in the same window/tab as it was clicked _blank - Opens the document in a new window or tab _parent - Opens the document in the parent frame _top - Opens the document in the full body of the window Ref:https://www.w3schools.com/
  • 4. HTML Links - Use an Image as a Link To use an image as a link, just put the <img> tag inside the <a> tag: <a href=“url"> <img src=“img.jpg" alt=“alternate text” style="width:32px;height:32px;"> </a> Ref:https://www.w3schools.com/
  • 5. Link to an Email Address <p> <a href="mailto:someone@example.com">Send email</a> </p> Button as a Link • To use an HTML button as a link, you have to add some JavaScript code. • JavaScript allows you to specify what happens at certain events, such as a click of a button. <button onclick="document.location='default.asp'">HTML Tutorial</button> Ref:https://www.w3schools.com/
  • 6. Link Titles The title attribute specifies extra information about an element. The information is most often shown as a tooltip text when the mouse moves over the element. <a href="url" title="hello">Visit our Page</a> Ref:https://www.w3schools.com/
  • 7. HTML Images • Images can improve the design and the appearance of a web page. • The HTML <img> tag is used to embed an image in a web page. • Images are not technically inserted into a web page; images are linked to web pages. The <img> tag creates a holding space for the referenced image. • The <img> tag is empty, it contains attributes only, and does not have a closing tag. • The <img> tag has two required attributes: •src - Specifies the path to the image •alt - Specifies an alternate text for the image <img src="url" alt="alternatetext"> Ref:https://www.w3schools.com/
  • 8. •Use the HTML <img> element to define an image •Use the HTML src attribute to define the URL of the image •Use the HTML alt attribute to define an alternate text for an image, if it cannot be displayed •Use the HTML width and height attributes or the CSS width and height properties to define the size of the image •Use the CSS float property to let the image float to the left or to the right Ref:https://www.w3schools.com/