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/