首页 >web前端 >css教程 >如何在 CSS 中将包裹的项目符号点与其第一行对齐?

如何在 CSS 中将包裹的项目符号点与其第一行对齐?

Susan Sarandon
Susan Sarandon原创
2024-12-05 03:31:10938浏览

How to Align Wrapped Bullet Points with Their First Line in CSS?

如何将换行项目符号行与第一行对齐

创建项目符号列表时,通常希望将换行项目符号与第一行对齐第一行。包裹部分不应包裹在项目符号下方,而应继续位于项目符号右侧。

CSS 和 HTML 实现:

要实现此对齐,请将项目符号括起来放在一个单独的 div 元素中,并将两个 div 包装在一个容器 div 中。

.row2 {
    padding-left: 20px;
    overflow: hidden;
    max-width: 500px;
}
.red-square-5 {
    position: absolute;
    width: 5px;
    height: 5px;
    margin-top: 0.5em;
    background: #f00;
}

<div>

通过这种方法,项目符号位置保持绝对,而项目符号项目文本环绕到项目符号的右侧。

以上是如何在 CSS 中将包裹的项目符号点与其第一行对齐?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn