2016-12-06 2 views
4

друзей я хочу знать, что если я объявил какой-либо div как фиксированное/абсолютное положение (без упоминания его ширины 100% или чего-то другого значения ширины), то почему он потерял значение по умолчанию? поскольку я знаю его элемент уровня блока, который принимает полную ширину окна просмотра, поэтому, когда я делаю его фиксированным или абсолютным положением, то почему он выглядит как встроенный блок и почему он не набирает полную ширину окна просмотра?заявленная позиция фиксированная или абсолютная в элементах уровня блока

<style> 
 
div{background:red; padding:20px 0;/*width:100%*/} 
 
div.demo{position:fixed;top:0; left:0;background:olive; 
 
    /*width:100%;*/} 
 
</style> 
 

 
<body> 
 
<div>lorem ipsum</div> 
 
<div>lorem ipsum</div> 
 
<div class="demo">lorem ipsum</div> 
 
<div>lorem ipsum</div> 
 
<div>lorem ipsum</div> 
 
</body>

ответ

2

Элемент с позиции: фиксированный; позиционируется относительно видовом, что означает, что всегда остается в том же месте, даже если страница прокручивается,

если вы не установите его ширина ширина его содержимое отображается как ширина по умолчанию

если вы установите его в процентах, тогда ширина будет отображаться в процентах, соответствующем области просмотра.

поэтому, если вы хотите, чтобы полная ширина порта просмотра была в вашем div, установите его ширину: 100%; Я добавил фрагмент ниже.

<style> 
 
div{background:red; padding:20px 0;/*width:100%*/} 
 
div.demo{position:fixed;top:0; left:0;background:olive; 
 
    width:100%;} 
 
</style> 
 

 
<body> 
 
<div>lorem ipsum</div> 
 
<div>lorem ipsum</div> 
 
<div class="demo">lorem ipsum</div> 
 
<div>lorem ipsum</div> 
 
<div>lorem ipsum</div> 
 
</body>

+0

Помимо этого, вы должны объявить положение: относительное для родительского (окружающего) div. –

+1

Это точка, которую он принимает только по своей ширине содержимого по умолчанию, когда он попадает в фиксированное или абсолютное положение. Хороший ответ sir – Indranil

+0

@Indranil tnx bro .. –

1

От w3c wiki on absolute positioning:

Абсолютно позиционируемые элементы будут термоусадочной пленкой, чтобы содержимое , если не указаны их размеров.

+0

Я не мог найти явного объяснения в спецификации относительно **, почему ** Это должно быть так, поэтому, возможно, это просто потому, что «это то, что решили люди в w3c». – Danield

Смежные вопросы