2014-11-27 3 views
0

:) когда я не устанавливаю верхние/левые свойства элемента фиксированный, что зашифровано ?? см этот пример кода:как рассчитать верхнее свойство для фиксированного элемента

#fixed-menu{ 
 
    background-color:#ba4444; 
 
    border-top: 5px solid #0892cd; 
 
    height: 60px; 
 
    position: fixed; 
 
    width: 100%; 
 
    z-index:9999; 
 
    box-shadow:rgb(128, 128, 128) 0px 5px 15px 0px; 
 
} 
 
#wrapper{ 
 
    height:900px; 
 
    width:960px; 
 
    margin:0 auto; 
 
    background-color:yellow; 
 
    margin-top:100px; 
 
    
 
}
<body> 
 
    <div id="fixed-menu"></div> 
 
    <div id="wrapper"></div> 
 
<body>
с кодом выше, фиксированным меню также есть 100px маржинального-топ !!!! почему ????? ................... как рассчитано верхнее свойство ???

+0

просто используйте 'position: relative' в' fixed-menu' div, и он будет работать как ожидалось – Izzy

+0

Iif i give top: 0px, которые работают ... , но я хочу понять, почему, когда я не устанавливаю верх: 0px, фиксированное меню будет иметь margin-top: 100px, поскольку обертка имеет margin-top 100px .....? – KavirPardaz

ответ

0

После того, как элемент был зафиксирован с position: fixed, три свойства left, width и right вместе определяют горизонтальное положение и размер, по отношению к окну. (CSS использует более общее слово окно просмотр, окно является примером просмотра.)

Вам нужно не более два из трех свойств, т.е. left & width, right & width или left & right. Также возможно установить только один из трех, или вообще ничего. В этом случае CSS будет использовать естественный («внутренний») элемент и/или позицию элемента по мере необходимости для любых свойств, оставшихся по умолчанию («auto»).

То же самое относится к трио top, height и bottom. Вам нужно установить не более двух из них: top, если вы хотите контролировать расстояние от верхней части окна, bottom для управления расстоянием снизу и height, если вы хотите указать фиксированную высоту.

Я надеюсь, что ответит на ваш вопрос. Для дальнейшего чтения вы можете обратиться к этому link

0

Совету: Fixed положения свободный парень потока в окне документа. На основе элемента, присутствующего до того, как фиксированный элемент выровняется рядом с ним.

В вашем примере нет элемента перед фиксированным div, но в следующем разделителе оберток вы устанавливаете верхнюю границу поля до 100 пикселей. который влияет на окно просмотра. Таким образом, вы можете представить, что видовой экран для фиксированного элемента начинается ниже метки 100px, установленной оберткой div.

вы можете увидеть удаление поля в обертке div или установить положение обертки с фиксированным краем 100px. вы получите эту идею.