如何在HTML <ul>中正确显示PHP变量？布局异常问题排查

你的问题出在PHP变量本身包含了破坏HTML结构的多余标签，从生成的页面源码就能明确看出：

• $dimensions的输出内容里带了</ul></li>，直接把<ul>提前闭合，导致第二个<li>被挤到了<ul>外面，自然无法应用列表的样式。
• $description的输出内容里自带了一个<p>标签，和你写的外层<p>形成嵌套，属于无效的HTML结构。

1. 清理变量中的多余HTML标签 #

输出PHP变量时，用strip_tags()过滤掉变量里的所有HTML标签，避免干扰页面结构：

<div>
    <ul class="product-info-list">
        <li><?php echo strip_tags($dimensions); ?></li>
        <li><?php echo strip_tags($materials); ?></li>
        <li><?php echo strip_tags($description); ?></li> <!-- 把描述放进li里，保持列表结构统一 -->
    </ul>
</div>

如果需要保留文本里的特殊字符（比如引号），可以搭配htmlspecialchars()转义，避免HTML解析错误：

<li><?php echo htmlspecialchars(strip_tags($dimensions)); ?></li>

2. 修正HTML结构规范 #

<ul>标签的直接子元素只能是<li>，不能直接放<p>。如果描述需要单独样式，要么把它放进<li>里，要么移到<ul>外面：

<div>
    <ul class="product-info-list">
        <li><?php echo strip_tags($dimensions); ?></li>
        <li><?php echo strip_tags($materials); ?></li>
    </ul>
    <p><?php echo strip_tags($description); ?></p> <!-- 把描述移到ul外面，结构更合规 -->
</div>

3. 从源头排查变量 #

如果这些变量是从数据库或用户输入获取的，要检查数据源头是否混入了错误的HTML代码，从根源上避免这类问题——比如在存储数据时就过滤掉不必要的标签。

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