Question

当用户将其向下滚动时，我想让我的标题在主要部分中移动。我试过了position:fixed但它没有用，你有什么建议？

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
        .header
        {
            height:6.14%;
            width:auto;
            background:red;
            position:fixed;
            margin:0px;
            padding:0px;
        }
        .headerIn
        {
            height:35px;
            width:auto;
            background:#666;
        }
        .main
        {
            width:auto;
            height:12000px;
            margin:0px 0px 0px 25px;
            padding:0px;
            border:2px #36F solid;
        }
    </style>
</head>

<body>
<div class="headerIn"><div class="header"></div></div>
<div class="main"></div>
</body>
</html>

Answer 1

试试这个

.header{
  position: fixed;
  right: 0;
  left: 0;
  top: 0;
  z-index: 1030;
}

Answer 2

http://jsfiddle.net/vN89e/12/

.headerIn {
    height:35px;
    width: 100%;
    background:#666;
    position:fixed;
    top: 0;
    left: 0;
}
.main {
    margin: 35px 0 0 25px;
    border:2px #36F solid;
    overflow-y: auto;
}

Answer 3

试试这个

.header {
   position:absolute;
   top:0;
   left:0;
   transform: translate3d(0,0,0);
}

Answer 4

您必须使用固定位置，但必须将top的值设置为零。绝对定位会将其附加到页面顶部，但不允许标题滚动整个页面。

.header
    {
        height:6.14%;
        width:auto;
        background:red;
        position:fixed;
        margin:0px;
        padding:0px;
        top: 0px;
    }

如何将我的标题移动到身体

4 个答案: