PHP/HTML中如何将哈希内存储的数组值横向打印而非纵向输出

你当前输出纵向排列的核心原因是<h2>属于HTML默认块级元素，每个标签会独占一行触发换行，按以下方式修改即可实现横向排列：

方案1：Flex布局（推荐） #

给分类列表加外层容器，搭配Flex布局实现可控的横向排列，支持自定义间距、对齐、溢出换行等效果：

1. 修改PHP/HTML代码

<div class="category-list">
    <?php foreach ($config['unsplash_categories'] as $cat): ?>
        <h2><?= $cat ?></h2>
    <?php endforeach ?>
</div>

2. 加入对应的CSS样式（可放在页面<head>的<style>标签内）

.category-list {
  display: flex;
  gap: 2rem; /* 调整分类之间的间距 */
  flex-wrap: wrap; /* 分类数量过多时自动换行，不需要可以删除 */
  align-items: center; /* 垂直居中对齐，不需要可以删除 */
}
/* 可选：重置h2默认的上下边距 */
.category-list h2 {
  margin: 0;
}

方案2：行内块元素（快速修改） #

如果只需要临时实现横向效果，不需要复杂布局控制，可以直接给h2标签添加行内块属性：

<?php foreach ($config['unsplash_categories'] as $cat): ?>
    <h2 style="display: inline-block; margin: 0 2rem 0 0;"><?= $cat ?></h2>
<?php endforeach ?>

内容的提问来源于stack exchange，提问作者Adachi