Getting started with html images and Images

Source: Internet
Author: User

Getting started with html images and Images

In HTML, the image is defined by the label.

is an empty tag, meaning that it only contains attributes and does not close tags.

To display images on the page, you need to use the source property src, which refers to "source ). The source attribute value is the image url.

The image syntax is as follows: .

The browser displays the image where the Document Image Tag appears. If you label the image in two paragraphs, then the browser

First select the first paragraph, and then the image appears. Then, the author is the next paragraph.

The alt attribute is used to define a reserved string of replaceable texts for an image. Replace the text property value with your own settings. Both Chinese and English can be used.

Example:

The good habit of replacing text helps to better display information, which is useful for those who use plain text browsers.

If an HTML file package contains ten images, 11 files need to be loaded to display the page correctly. Loading images takes time.

Image background

Both gif and jpg files can be used as HTML backgrounds. If the image is smaller than the page, the image will be duplicated.

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

Image Alignment

Picture align center

Picture alignment top

The default image alignment is bottom.

Image floating

A section with an image. Set the align attribute of the image to "left ". The image will float to the left of the text

A section with an image. Set the align attribute of the image to "right ". The image will float to the right of the text

Adjust the image size

You can zoom in or out an image by changing the values of the "height" and "width" attributes of the img tag.

Zoom out image:

Enlarged image:

Image Creation hyperlink

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

Border indicates the border. border = "0" indicates that the image has no border. In html, the image has a border by default.

Image ing

<Map name = "mingzi" id = "mingzi">

<Area

Shape = "square"

Coords = "0.0.0.0"

Href = "http://www.baidu.com"

Target = "_ blank"

Alt = "thumbnail"/>

Here: usemap = "# name" alt = "Replace text" map tag defines image ing

Area refers to a hot area, that is, to draw an area on an image, and then you can give a link address for this area.

Shape = shape heat zone has three kinds of painting rectangles, polygon, and circle. Coords = landmark, circle at 3

Href = hyperlink. Target = "_ blank" refers to opening a new page on another page.

Related Article

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.