还是大剑师兰特：曾是美国某知名大学计算机专业研究生，现为航空航海领域高级前端工程师；CSDN知名博主，GIS领域优质创作者，深耕openlayers、leaflet、mapbox、cesium，canvas，webgl，echarts等技术开发，欢迎加底部微信（gis-dajianshi），一起交流。

No.	内容链接
1	Openlayers 【入门教程】 - 【源代码+示例300+】
2	Leaflet 【入门教程】 - 【源代码+图文示例 150+】
3	Cesium 【入门教程】 - 【源代码+图文示例200+】
4	MapboxGL【入门教程】 - 【源代码+图文示例150+】
5	前端就业宝典 【面试题+详细答案 1000+】

CSS块状元素是指在页面布局中自动换行显示，能够设置特定宽度和高度，围绕内容撑开，可包含内联元素和其他块状元素的HTML元素，如**<div>, <p>, <h1>**等，常用于构建网页结构和布局。

一、块状元素的特点和行为

1. 独占一行：块状元素在页面布局中自动从新的一行开始，并且其后的元素也会被强制到下一行显示，即使它们之间没有明确的换行指令。

2. 宽度与高度：块状元素可以设置明确的宽度（width）和高度（height），默认情况下，宽度会尽可能地占据其父元素的全部可用空间（通常是100%），而高度则根据内容来决定，但也可以通过CSS设定具体的值。

3. 内外边距和边框：块状元素可以设置内边距（padding）、外边距（margin）和边框（border），这些属性不会影响其周围的布局方式，即元素周围的空间可以被调整。

4. 内容流布局：块状元素可以包含内联元素（如<span>、<a>）和其他块状元素作为其子元素，这使得它们成为构建复杂页面结构的理想选择。

5. 默认样式：大多数浏览器对块状元素有一些默认的样式设置，比如段落<p>标签会有一定的上下外边距和字体样式，这些可以通过CSS进行重置或修改。

二、常见的块状元素

• <div>：最通用的容器元素，用于布局和分组。
• <p>：段落文本。
• <h1>至<h6>：不同级别的标题。
• <ul>、<ol>：无序列表和有序列表。
• <li>：列表项。
• <table>：表格。
• <tr>、<td>、<th>：表格行、单元格和表头单元格。
• <form>：表单容器。
• <header>、<footer>、<nav>、<main>、<article>、<section>等HTML5语义化元素。

通过CSS，开发者可以改变元素的默认布局行为，例如，使用display: inline;将块状元素转换为内联元素，或者使用display: inline-block;让元素保持块状特性的同时以内联方式显示，以便更精细地控制页面布局。