前端HTML面试题, HTML 行内元素有哪些?块级元素有哪些?空void元素有哪些?

QA

Step 1

Q:: HTML 行内元素有哪些？

A:: HTML 行内元素（Inline Elements）是指那些不会自动换行，并且仅占用其所需空间的元素。常见的行内元素包括：<a>、<span>、<img>、<input>、<label>、<strong>、<em>、<b>、<i>、<small>、<abbr>、<cite>、<code>、<sub>、<sup> 等。行内元素通常用于包裹少量内容或特定文本的格式化。

Step 2

Q:: HTML 块级元素有哪些？

A:: HTML 块级元素（Block Elements）是指那些会自动换行，并且占据其父容器的整个宽度的元素。常见的块级元素包括：<div>、<p>、<h1> - <h6>、<ul>、<ol>、<li>、<table>、<section>、<article>、<nav>、<header>、<footer>、<aside>、<form> 等。块级元素通常用于创建页面布局或结构化内容。

Step 3

Q:: HTML 空（void）元素有哪些？

A:: HTML 空（Void）元素是指那些没有闭合标签，且不包含内容的元素。常见的空元素包括：<br>、<img>、<input>、<link>、<meta>、<hr> 等。空元素通常用于页面布局和功能性的标记（例如换行、插入图片、表单输入等）。

用途

这些问题通常用于评估候选人对HTML基础知识的理解，这对于构建网页的结构和内容至关重要。在实际生产环境中，开发者会频繁使用这些元素来组织页面内容、定义布局和结构。如果开发者不能熟练掌握这些基础概念，可能会导致页面布局问题、内容显示不正确，甚至影响用户体验和SEO效果。\n

相关问题

🦆

什么是HTML的语义化?▷

HTML的语义化指的是使用具有语义意义的标签（例如<header>、<article>、<footer>等），而不是无意义的<div>和<span>标签。这种做法可以提高代码的可读性和可维护性，并且对搜索引擎优化（SEO）和屏幕阅读器用户友好。

🦆

行内元素和块级元素的区别是什么?▷

行内元素不会自动换行，并且只占用其内容所需的空间，而块级元素会自动换行，并占据父容器的整个宽度。在布局设计中，行内元素用于包裹少量内容或特定文本，而块级元素用于创建页面的结构和布局。

🦆

如何在CSS中将行内元素转换为块级元素,或反之?▷

在CSS中，可以通过display属性将行内元素转换为块级元素，例如：display: block;。同样，也可以将块级元素转换为行内元素，例如：display: inline;。此外，还可以使用display: inline-block;来创建既具有行内元素特性又具有块级元素特性的元素。

🦆

哪些元素是可替换元素?▷

HTML 中的可替换元素（Replaced Elements）是指那些在文档中显示的内容由外部资源来决定的元素，而不是直接在 HTML 代码中。例如 <img>、<video>、<iframe>、<object> 这些元素都是可替换元素。浏览器会根据指定的资源内容来渲染这些元素。

🦆

HTML5 新增了哪些语义化标签?▷

HTML5 引入了一些新的语义化标签，例如 <article>、<section>、<nav>、<header>、<footer>、<aside>、<main> 等。这些标签的引入使得页面结构更加清晰，并且对搜索引擎和屏幕阅读器更加友好。

iframe有哪些优点和缺点？什么是HTML语义化？