Nasıl Oluşturulur: Kaydırırken Sabit Başlık

CSS ve JavaScript kullanarak kaydırırken sabit/yaşayan başlık nasıl oluşturulur öğrendiğinizden bahseden bir ders.

Kişisel olarak deneyin

Kaydırırken Sabit Başlık Oluşturma

İlk Adım - HTML Ekle:

<div class="header" id="myHeader">
  <h2>My Header</h2>
</div>

İkinci Adım - CSS Ekle:

Sayfa başlığının tarzını ayarlayın; position: yapışkan ve top: 0 ekleyin, böylece sayfa başlığı kaydırıldığında üstte sabit kalır.
.header {
  position: yapışkan;
  üst: 0;
  dolgu: 10px 16px;
  arka_plan: #555;
  renk: #f1f1f1;
}

Kişisel olarak deneyin

öğe position: yapışkan; sonrası, konumu kullanıcıların kaydırma konumuna göre belirler.

Yapışkan öğe, kaydırma konumuna göre göreceli konum ve sabit konum arasında geçiş yapar. Belirtilen kaydırma konumuna ulaşana kadar göreceli konumda kalır; ulaştıktan sonra o konuma 'yapışır' (yani position: sabit aynı)。

Dikkat:Yapışkan konumun etkin olabilmesi için en az birini belirtmeniz gerekiyor. üstvesağvedüşük veya soluk 中的一个。

Related pages

Tutorial:CSS position