Img en HTML5 est-il un élément de niveau bloc ?

青灯夜游
Libérer: 2021-12-16 16:15:56
original
3033 Les gens l'ont consulté

L'img de

html5 n'est pas un élément de niveau bloc. img est un élément en ligne et est également un élément de remplacement. Il possède des attributs de largeur et de hauteur intégrés, de sorte que la balise img peut définir la largeur et la hauteur. img est un élément de remplacement en ligne. La hauteur, la largeur, le remplissage et la marge sont tous disponibles et l'effet est égal à celui des éléments de bloc.

Img en HTML5 est-il un élément de niveau bloc ?

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

<img /> Utilisation de base des balises

<img /> 标签的基本使用

浏览器支持

  • 所有主流浏览器都支持 <img> 标签

标签定义及使用说明

  • <img> 标签定义 HTML 页面中的图像
  • <img> 标签有两个必需的属性:src 和 alt
  • 强烈推荐在开发中每个图像中都使用 alt 属性。这样即使图像无法显示,用户还是可以看到关于丢失了什么东西的一些信息。而且对于残疾人来说,alt 属性通常是他们了解图像内容的唯一方式

<img />究竟是什么元素

<img /> 是行内元素还是块级元素?

  • <img /> 标签没有独占一行,所以是行内元素,这没啥问题

既然是行内元素为什么能够设置宽高呢?

  • 这个问题就要引申出下面部分了,<img /> 标签属于替换元素,具有内置的宽高属性,所以可以设置,具体解释看下面。

元素的定义

从元素本身的特点来讲,可以分为不可替换元素和替换元素

元素相关的MDN解释

不可替换元素

  • (X)HTML 的大多数元素是不可替换元素,即其内容直接表现给用户端(例如浏览器)
  • 如:<h1>我是标题</h1>

可替换元素

  • 浏览器根据元素的标签和属性,来决定元素的具体显示内容
  • 例如浏览器会根据 <img> 标签的src属性的值来读取图片信息并显示出来,而如果查看(X)HTML代码,则看不到图片的实际内容;又例如根据 <input> 标签的type属性来决定是显示输入框,还是单选按钮等
  • (X)HTML中的 <img>、<input>、