Getting Started with HTML images

Source: Internet
Author: User

In HTML, the image is defined by the tag.

is an empty label, meaning that it contains only attributes and does not have a closed label.

To display an image on a page, you need to use the source attribute src, which refers to "source". The value of the Source property is the URL address of the image

The image syntax defined is: .

The browser displays the image where the document Image label appears. If you label the image in a two-paragraph, then the browser

The first paragraph is selected, and then the image is presented, and the next paragraph is the one in which it appears.

The ALT attribute is used to define a string of reserved replaceable text for an image. The replacement Text property value is set by itself. Can be used in both English and Chinese.

Example:

Having a good habit of replacing text helps to better display information, which is useful for people who use a plain text browser.

If an HTML file contains 10 images, you need to load 11 files in order to display the page correctly. It takes time to load the picture.

Image background

GIF and JPG files can be used as HTML backgrounds, and images are duplicated if the image is smaller than the page.

Example: <body background= "background image address .jpg>

Image alignment

Picture Alignment bottom

Picture Alignment Middle

Picture Align Top

The default alignment for a picture is bottom.

Image floating

A paragraph with an image. The Align property of the image is set to "left". The image will float to the left of the text

A paragraph with an image. The Align property of the image is set to "right". The image floats to the right of the text

Adjust the size of an image

You can enlarge or reduce the image by changing the value of the "height" and "width" Properties of the IMG tag

Shrink Image:

Enlarge Image:

Picture Making hyperlinks

<a href= "www.baidu.com" >

Border is the meaning of the border, border= "0" here means that the specified picture has no border, in the HTML, the image default is a border.

Image mapping

<map name= "Mingzi" id= "Mingzi" >

<area

Shape= "Square"

Coords= "0.0.0.0"

href= "Http://www.baidu.com"

target= "_blank"

alt= "Small picture"/>

Where: usemap= "#名字" alt= "replace text" map tag definition image map

Area is the meaning of hot zone, is to draw an area on a picture, and then you can give this area a link address

Shape= shape Hot Zone has 3 kinds of descriptive rectangles, polygons, circles. Coords= Landmark, 3 points is round

href= hyperlinks. target= "_blank" means opening a new page on another page.

Getting Started with HTML images

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

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

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

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

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.