javascript - 将 margin-bottom 添加到固定的 div

Question

有几个页面我想通过放置一个脚本来动态添加一个粘性标题。此代码在放置 js 的任何位置添加标题。但是粘性标题应该有一个 margin-bottom，以便标题和内容之间有一个分隔。

http://jsfiddle.net/5gk5vwq7/

正如您在 fiddle 中看到的那样， header 覆盖了一些内容。

我无法更改“内容”CSS 中的任何内容。那么，这是否可以通过仅修改 js 或 header css 中的任何内容来实现。

将 margin-bottom 添加到 #MarkerTools css 无效

HTML:

<div id="form">
    <div id="content">Lorem ipsum</div>
</div>

CSS:

#MarkerTools {
    width: 100%;
    height: 50px;
    position: fixed;
    top: 0;
    background: #2b539a;
}

JS:

 $('#form').append('<div id="MarkerTools"></div>');

Answer 1

只需将内容向下推 60px 或任意多:

var form = $('#form');
form.css({'position':'relative','top':'60px'}).append('<div id="MarkerTools"></div>');

检查 DEMO