Question

我是css和html的新手。我想要显示这样的东西

简介......第1页

第1章......第2页

页码显示在行尾

这里是我写的代码

<!DOCTYPE html>
<html>
<head>
<style>
p { 
    word-spacing: 5px;

}
pp { 

    text-align:end;
}
</style>
</head>
<body>

<p>

This is some text testing. 
<span class="pp">This is some text</span>
</p>

</body>
</html>

Answer 1

您可以使用float: right：

＆＃13;

p { 
    word-spacing: 5px;
    text-align: left;
}
p span { 
    float: right;
}

＆＃13;

<p>
This is some text testing. 
<span class="pp">This is some text</span>
</p>

＆＃13;

或者您可以使用flexbox

＆＃13;

p { 
    word-spacing: 5px;
    display: flex;
    justify-content: space-between;
}

＆＃13;

<p>
This is some text testing. 
<span class="pp">This is some text</span>
</p>

＆＃13;

如何使用css显示2个单词，开头的第一个单词和同一行末尾的另一个单词？

1 个答案: