在 html 中动态插入 div 在具有 -1em 的 margin-top 的 h1 标记前面答案

【问题标题】：inserting div dynamically in html in front of h1 tag that has margin-top of -1em在 html 中动态插入 div 在具有 -1em 的 margin-top 的 h1 标记前面
【发布时间】：2011-08-29 05:26:06
【问题描述】：

我有现有的文档，我正在尝试将逻辑页码插入其中。在下面的 xhtml sn-p 中，这是 .pagerule-cls div。我发现一个文档不能很好地处理，因为页面上第一个元素的影响 css 的边距顶部为 -1em。我的页码插入最终位于原始文档的 h1 文本的中心。我可以做些什么来确保 h1 标题“简介”出现在我使用适当的 pagerule-cls css 插入页码之后？

对了，body元素上的样式也是我插入改变左右边距的。

安迪

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/>
    <style>
        .calibre14 {
            display: block;
            font-size: 1.5em;
            font-weight: bold;
            margin-bottom: 0.67em;
            margin-left: 0;
            margin-right: 0;
            margin-top: -1em;
            text-align: center
            }
        .calibre4 {
            display: block;
            margin-bottom: 0;
            margin-left: 1.25em;
            margin-right: 0;
            margin-top: 0;
            text-align: justify
            }
        .pagerule-cls {
            text-align: center;
            font: 13px Arial, Helvetica, sans-serif;
        }
    </style>
</head>
<body style='margin-left:100px;margin-right:10px;min-width:400px;max-width:800px;'><a name='stagpage6' id='stagpage6'/><div class='pagerule-cls'>7</div>
<div><blockquote class="calibre4"><span>
<h1 class="calibre14"><span><span class="bold"><a></a>INTRODUCTION</span></span></h1>
<div></div></span></blockquote></div>
</body>
</html>

【问题讨论】：

你在哪里插入号码？在标题的顶部还是前面？

标签： html css xhtml

【解决方案1】：

最简单的方法是在.pagerule-cls 中添加margin-bottom: 1em;，这可能会导致其他文档的边距过大。更好的是仅将这种额外样式添加到相关文档中。你如何修改文件？可以查询-1em吗？

【讨论】：

我对文档进行预处理以修改它们。我不认为我可以添加任意 1em 或查询。我运气不好。