Image Label properties in HTML

Last Update:2017-02-28 Source: Internet

Author: User

Tags format object relative

Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

--image label attributes in HTML
The image can make the webpage more vivid and beautiful. The browser can display JPEG and GIF images, where GIF images can only use 256 colors (that is, only 8-bit colors), while the JPEG format can be saved as 24 bits, with the best effect on the image for specific continuous tones. However, GIF images are less image-quality than JPEG images, but they take up a faster download in storage space. Therefore, depending on the circumstances, the image of which format should be used should be determined.
Inserting images in an HTML document is achieved by tags. The label has a total of 9 properties. Except that attribute src is not a default, other properties are optional.

One, src attribute. SRC is source, which indicates where the referenced image file is located. For example:

Absolute path notation:

Relative path notation:

The attribute parameter value of src is the URL of the image file. Note that the relative notation can be used to identify the location of the image file only if the image file and the HTML document are in the same directory.

Second, align Properties. The parameter value of the Align property is top,middle,bottom. The adjacent text of the image is located at the top left of the image, in the middle of the right, and in the lower right-hand side. For example:

<title> test Page </title>
<body>
<HR>
my icons look good?
 
<HR>
 
What about this one more?
 

<HR>
</body>

You can change the image into your own. Note that the default directory for browsers is the Windows/temp temporary folder. You need to specify the directory where the image is located.

Four, alt attribute. When browsing the Web, users often choose not to download pictures for time or for other reasons, and adding ALT attributes can show some information about the image in the location where it was originally displayed. The parameter value of the ALT attribute is the text message that the page editor wants to appear in the place where the image was originally displayed, usually the name of the image and a brief description. For example.

Five, determines the image margin properties.

tags use the vspace and Hspace properties to determine the size of the white space between the image and its adjacent object. The Vspace property is used to specify the distance between the image and adjacent objects in its vertical direction. The hspave is used to specify the distance between the image and its horizontal direction adjacent to the object. The arguments for both of these properties are numbers, which indicate the number of pixels in the space between.

Six, border properties.

When the browser calls the image, it adds a different width to the image, depending on the browser window and the size of the original image. We can use the Border property to specify the width of the image border or to remove the border <border=0>. The parameter value of the Border property is also a number that represents the pixel count of the border width. For example:

<title> test Page </title>
<body>
<HR>

Look at the effect on the line.
 
<HR>
 
</body>

The larger the border parameter value, the larger the border.

Seven, Ismap property

This property is related to the hyperlink in the document and we'll explain it in detail later.

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More