html - 我怎样才能在文本旁边的边距中放置一些东西？

Question

我有一些从原始打印文档中提取的 HTML。它有一些页码:

<span class="page">42</span>

散布在原始文档有分页符的段落中间(没有语义原因，只是因为那是页面末尾恰好落在的地方)。

现在我只是隐藏了它们。但我想将页码 float 到文本的左侧或右侧。它可能看起来像这样:

    ...
    random text. It has roots in a piece of classical Latin
    literature from 45 BC, making it over 2000 years old.
    Richard McClintock, a Latin professor at Hampden-Sydney      42
    College in Virginia, looked up one of the more obscure
    ...

用 jQuery 不难，但我可以用普通的旧 CSS 实现这种效果吗？看起来 CSS float 属性总是将内容放在内部封闭 block 中，而不是边距中。

Answer 1

我想到了几种方法:

.page
{
    float: right;
    margin-left: 100px;
}

或者这可能会更好:

.page
{
    float: right;
    margin-right: -100px;
}

或者，如果有 <p />围绕实际段落的标记，

p
{
    position: relative;
}
.page
{
    position: absolute;
    right: -100px;
    top: 0;
}

根据您现有的文档，很难确定什么最有效，但这些是一些可以帮助您入门的想法。