.html中用ul和li让文字在图片下方
时间: 2024-10-14 17:13:36 浏览: 7
HTML中,如果你想让一段文字显示在图片下方,可以使用`<ul>`标签创建无序列表(通常用于项目符号列出内容),配合`<li>`标签来添加每个条目。这里是一个基本示例:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<style>
/* 如果你想调整样式,例如文字对齐于图片右侧 */
img {
float: left;
margin-right: 20px; /* 图片与文字之间留出一些空间 */
}
</style>
</head>
<body>
<img src="your_image_url.jpg" alt="图片描述"> <!-- 替换为你的图片URL -->
<ul>
<li>这是一段文字,它显示在图片下方。</li>
<!-- 可以在这里添加更多文字条目 -->
</ul>
</body>
</html>
```
在这个例子中,`<img>`标签定义了图片元素,`float: left`使其浮动到左边,而`<li>`标签则用于创建列表项,文字会自动紧随其后。
阅读全文