Home > Article > Web Front-end > How to define images and their image sizes in html?

How to define images and their image sizes in html?

藏色散人Original: 2018-08-25 16:37:5716409browse

In the process of making HTML web pages, image references are essential. So how is the HTML definition image written? How are the size and width of images controlled using HTML code? This article will give you a detailed introduction to the relevant knowledge about html image tags and how htm defines image size. Hope it helps friends in need.

The specific code example of HTML definition image is as follows:

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>html图像标签使用示例</title> 
</head>
<body>
<p>
一个图像:
<img src="/upload/course/000/000/010/58046a2b7e46d104.gif" alt="Smiley face" width="32"    style="max-width:90%"></p>
<p>
一个动图:
<img src="/upload/course/000/000/010/58046a41c6e3c115.gif" alt="Computer man" width="48"    style="max-width:90%"></p>
<p>
注意HTML定义图像和插入动图的语法是一样的。
</p>
</body>
</html>

The effect is as follows:

How to define images and their image sizes in html?

The above is a simple example of how to use HTML to display images in a web page.

Let me give you an example of getting pictures from the server and then displaying them:

<p>一个来自文件夹中的图像:</p>
<img src="/upload/course/000/000/010/58046b14a8b9f738.gif" alt="Google Chrome" width="33"    style="max-width:90%"><p>一个来自php中文网的图像:</p>
<img src="/upload/course/000/000/010/58046c29b47ef575.png" alt="php.cn" width="336"    style="max-width:90%">

The effect is as follows:

How to define images and their image sizes in html?

# #Through the above description, everyone should have seen an important label.

tag:

In HTML, an image is defined by the How to define images and their image sizes in html?

tag, which is an empty tag that only contains attributes and has no closing tag. To display an image on the page, you need to use the source attribute (src). src refers to "source". The value of the source attribute is the URL address of the image.

You should also notice the width and height attributes here. These two attributes represent the width and height of the image respectively. Then mastering these two attributes can help novices solve the problem of how to use HTML to define the image size, that is, to control the HTML code to display the image size.

In summary, I hope it will be helpful for everyone to learn how to use HTML image tags and how to define image sizes in HTML.

The above is the detailed content of How to define images and their image sizes in html?. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：How to center the th header content in an html table? A detailed introduction to the align attribute of th table header tagNext article：How to center the th header content in an html table? A detailed introduction to the align attribute of th table header tag

See more

How to define images and their image sizes in html?

Related articles