Home  >  Article  >  Web Front-end  >  HTML tag: summary of usage of img tag

HTML tag: summary of usage of img tag

不言
不言Original
2018-08-08 09:38:334525browse

The content of this article is about HTML tags: a summary of the usage of img tags. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

1. The Img tag has two important attributes:

1.src attribute: the address of the picture

2.alt attribute: the picture does not The display is actual text

2. The Img tag is a line-level element:

img and input are inline replacement elements. height/width/padding/margin are all available. The effect is equal to the block element. Inline non-replacement elements, for example, height/width/padding top, bottom/margin top/bottom have no effect. Only padding left/right and margin left/right can be used to change the width.

3. Center the Img tag:

1. The first method: I don’t like this method very much. The Img tag cannot be set to table-cell. Prone to errors.

img_p{
        display: table-cell;vertical-align: middle;  /*控制图片垂直居中*/
        text-align: center;  /*控制图片水平居中*/      }

2. The second method: In this method, it is best not to have the margin attribute for the Img tag, otherwise it will not be centered.

img{
    position: absolute;top:50%;left: 50%;
    transform:translate(-50%,-50%);    
}

4. Img tag event:

1. Use the onerror event of the HTML DOM Event object to process images that display exceptions.

<img src="img/1.jpg" alt="这是一张图片" onerror="alert(this.alt)">

Recommended related articles:

html layout: implementation code of html three-column layout

What is the innerHTML attribute? Usage of innerHTML attribute

The above is the detailed content of HTML tag: summary of usage of img tag. 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