CSS固定标题 - 它需要两个位置吗?

时间:2017-06-22 17:17:06

标签: html css position css-position

我看到了一些浮动的例子,但是我想知道在修复标题时是否必要来声明两个位置?

例如,您是否需要声明top:0; left:0;?:

.header {
 position: fixed;
 top: 0;
 left:0;
 width:100%;
}

或者你可以只用top:0;逃脱?:

.header {
 position: fixed;
 top: 0;
 width:100%;
}

我有点困惑,因为我已经看过两者的例子,但如果设置top:0; left:0'是必要/优于top:0;,我无法找到合理的解释固定标题?

2 个答案:

答案 0 :(得分:0)

由于width100%,因此无论如何都无关紧要。但是,如果宽度不是100%,并且如果<nav>是未位于左上角的元素的子元素,则您的导航将根据父级水平定位元件。 (不是一直到左边)

答案 1 :(得分:0)

如果未声明topleft,则默认为left:autotop:autoleft的自动均值(对于固定定位元素):

  • 如果定义了右边和宽度,则计算左边

  • 如果未定义宽度或右侧,则从非滚动位置的内容的默认流量计算左侧,如块元素。

然后,如果您使用position:fixed,通常需要使用左/右和上/下样式。

要查看差异,请使用margin-right:-100px并将标头放在其他元素中,例如表格的第二个单元格。

在此测试 - 您可以添加left:0并重新测试。 https://jsfiddle.net/vau6g09f/