HTML面试题

什么是语义化标签

语义化标签就是用标签本身的意义去描述内容，而不是仅靠类名或样式定义，是现代HTML开发的重要原则。
简单来说就是用合适的标签，表达合适的内容。

常见的语义化标签

• <header>: 页面的头部
• <footer>: 页面的尾部
• <nav>: 导航
• <article>: 文章
• <section>: 节
• <aside>: 侧边栏

盒模型

每个元素都可以看作一个矩形的盒子，由内到外包含四个部分：

• 内容区域（Content）：显示文本或图片的区域，可通过 width 和 height 设置宽高。
• 内边距（Padding）：内容与边框之间的空白区域，透明且受背景影响。
• 边框（Border）：围绕内边距的边框，可设置样式、粗细、颜色。
• 外边距（Margin）：盒子与其他元素之间的空白区域，透明且不会影响内部尺寸。

两种盒模型：标准与怪异

根据 box-sizing 属性的不同，盒模型分为两种计算方式：

标准盒模型（content-box）

实际宽度 = width + padding + border 实际高度 = height + padding + border

怪异盒模型（border-box）

实际宽度 = width 实际高度 = height