WordPress自从将默认编辑器改为Gutenberg后，一直在大力提倡块（Blocks）元素。HTML中也有块的定义，它们之间有什么相同和区别呢？现在WordPress建站流行可视化页面编辑，虽说无需编码，但了解了区块的概念对大家设计页面有莫大帮助。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
什么是HTML区块
每个 HTML 元素都有一个默认显示值（区块或内联），具体取决于它是什么类型的元素。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
块级元素总是从一个新行开始，浏览器会自动在元素前后添加一些空间（边距）。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
区块示例：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
<div>欢迎光临站长帮</div>内联示例：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
<span>欢迎光临站长帮</span>块级元素总是占据可用的整个宽度（尽可能向左和向右伸展）。而内联元素不在新行开始，内联元素只占用必要的宽度。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
一个块级元素中，可以包含很多的元素，可以包含子块、内联元素等。或者也可以将区块称为容器（Container），能将各种内容装入其中，例如文字、图片等。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
两个最常用的块元素是：<div>和<p>，另外常用的还有下列这些：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
<address><article><aside><blockquote><canvas><dd><div><dl><dt><fieldset><figcaption><figure><footer><form><h1>-<h6><header><hr><li><main><nav><noscript><ol><p><pre><section><table><tfoot><ul><video>什么是WordPress中的块（Blocks）？
WordPress的Gutenberg目前将涉及 WordPress 的每一部分——编辑、定制（包括完整站点编辑、块模式、块目录和基于块的主题）、协作和多语言——以及专注于一种新的编辑体验，块编辑器。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
Blocks 将段落、标题、媒体和嵌入全部视为组件，当它们串在一起时，构成了存储在 WordPress 数据库中的内容，用嵌入式媒体和简码取代了自由格式文本的传统概念。新编辑器采用渐进式增强设计，这意味着它向后兼容所有遗留内容，并且它还提供了一个过程来尝试使用客户端解析将经典块转换和拆分为等效块。最后，这些块提供了增强的编辑和格式控制。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
编辑器通过可视化、拖放式创建工具和强大的开发人员增强功能为用户提供丰富的新价值，包括现代供应商包、可重用组件、丰富的 API 和挂钩，以通过自定义块、自定义块样式和插件修改和扩展编辑器。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
简而言之，用户在编辑区块的时候不用考虑其HTML脚本，仅需专注其内容和定义设置就可以，最终 WordPress 负责将用户编辑的内容输出为一个一个的HTML区块。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
在块编辑器中，每一个自定义的块都有一个唯一的ID，用户对该块的所有自定义设置不会影响其它区块。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
其实其它的WordPress可视化编辑器原理也是类似的，例如 Elementor、Beaver Builder、Brizy、WPBakery Page Builder 等，只是它们各自使用的元素定义方式不同，存储在数据库中的内容格式不同，但最终都会输出为一个一个的HTML区块。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
WordPress块编辑的好处
在块编辑器诞生之前，WordPress的帖子仅存储内容，几乎没有HTML元素。而HTML元素则需借助主题模板来完成，这对于用户而言要设计模板需要掌握HTML编码知识，现在则不然，通过编辑器的各种选项即可方便设计出各式各样的网页。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
未来的块编辑功能会越来越强，如果用户觉得Gutenberg编辑器自身还不够强大，还可以选用额外的扩展插件，它们基于Gutenberg编辑器，可以为每一个块元素提供更多的额外定制选项。例如：GenerateBlocks、Kadence Blocks、The Plus Addons for Block Editor、Otter、Stackable 等。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html
现代网页都由1个或多个块组成，当每个块都能方便的设计，那么网页设计也就变得更方便，是时候改变由主题模板定义网页界面的方式了。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/cms/33402.html