欢迎来到本课程
在本课程中，我们将探索如何在不使用theme.json文件的情况下创建区块样式表。
通过本课程，您将：
- 了解区块样式表的概念
- 创建自定义区块样式表
什么是区块样式表？何时使用它？
您始终可以选择在theme.json中编写CSS。
这里有一个为WordPress核心画廊区块编写的示例。但是，当您的CSS变得过于冗长时，区块样式表就是解决方案。
现在让我们看看WordPress目录中的几个区块主题。
第一个主题叫做Ronny，由ThemeinWP创建。
第二个主题叫做Charity Vibes，由Iconic Themes创建。
样式表存放位置
您始终可以选择将CSS放在style.css中。
但对于大型项目，您可能需要考虑按区块拆分样式表，然后将其放入assets等文件夹中。这样可以提高网站性能，并使大型项目更易于管理。
在Ronny主题中，他们选择将区块样式表放在’assets/styles’中；而在Charity Vibes中，他们选择将样式表放在’assets/css’中，文件名为blocks.css。
由此可见，您可以自由选择文件和文件夹的命名方式。
创建自定义区块样式表
现在让我们看看如何创建自定义区块样式表。
命名规范
区块样式表的类名是.wp-block-{namespace}-{slug}，对于核心区块，您可以使用类.wp-block-{slug}，区块样式表则命名为core-{slug}.css。
注册区块样式表
要注册区块样式表，您需要使用wp_enqueue_block_style函数。
第一个参数传递区块名称，第二个参数传递参数数组。您可以使用functions.php来注册区块样式表。
以下是为WordPress核心图片区块注册样式表的示例，这是使样式出现在页面head区域所需的最少代码：
add_action( 'init', 'themeslug_enqueue_block_styles' );
function themeslug_enqueue_block_styles() {
wp_enqueue_block_style( 'core/image', array(
'handle' => 'themeslug-block-image',
'src' => get_theme_file_uri( "assets/blocks/core-image.css" ),
'path' => get_theme_file_path( "assets/blocks/core-image.css" )
) );
}
后续步骤
您可以通过参考WordPress.org上提供的主题手册，了解更多关于区块样式表的信息。