ul li内的文字上下左右居中

在HTML中，如果你想要让`<ul>`列表项 (`li`) 内的文字在水平和垂直方向上都居中，可以结合CSS样式来实现。通常情况下，你可以使用以下方法：

1. **内联元素**:
对于行内元素，如`<span>`，可以直接设置 `text-align: center;` 属性使其水平居中，并使用 `vertical-align: middle;` 或者设置 `line-height` 相同于 `li` 的高度来垂直居中。

<ul>
    <li><span>文字内容</span></li>
</ul>

<style>
    ul {
        list-style-type: none;
    }
    li span {
        display: inline-block; /* 或 inline */
        text-align: center;
        vertical-align: middle;
        line-height: normal; /* 如果需要针对字体大小调整高度 */
    }
</style>

2. **块级元素**:
对于块级元素，例如默认的`<p>`或自定义的`<div>`，则可能需要额外的布局技巧，比如 flexbox 或 grid。如果所有`li`都有相同的宽度，可以使用 `display: flex; justify-content: center; align-items: center;`。

<ul style="list-style-type: none;">
    <li style="position: relative;"> <!-- 添加定位以便应用样式 -->
        <div class="content">
            文字内容
        </div>
    </li>
</ul>

<style>
    .content {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%; /* 或者适应父元素宽度 */
    }
</style>

记得在实际应用中根据需求调整样式，例如考虑响应式设计和浏览器兼容性。