كيفيت سے ثابت منیجر بنانا

کيفيت سے اوپر ثابت منیجر بنانا

پہلا قدم - ایچ تی ایم ایل اضافہ کریں:

<div class="navbar">
  <a href="#home">Home</a>
  <a href="#news">News</a>
  <a href="#contact">Contact</a>
</div>
<div class="main">
  <p>Some text some text some text some text..</p>
</div>

دوسرا قدم - سی ایس ایس اضافہ کریں:

لایک خواہش رکھتا ہوئے اوپر ثابت منیجر بنانے کیلئے استعمال کریں position:fixed و top:0لطفاً توجه کنید، فیکس منیجر آپ کے دیگر محتوا کو بھی کوریج کر سکتا ہے. اس مسئلے کو حل کریں تاکہ آپ محتوا کے اوپر ایک برابر یا بڑا سائز کا فضا اضافہ کریں جو منیجر کی سائز سے برابر ہو (margin-top).

/* 导航栏 */
.navbar {
  overflow: hidden;
  background-color: #333;
  position: fixed; /* 将导航栏设置为固定位置 */
  top: 0; /* 将导航栏置于页面顶部 */
  width: 100%; /* 全宽 */
}
/* 导航栏内的链接 */
.navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}
/* 鼠标悬停时更改背景 */
.navbar a:hover {
  background: #ddd;
  color: black;
}
/* 主要内容 */
.main {
  margin-top: 30px; /* 添加上外边距以避免内容重叠 */
}

خود کو کچھ کریں

کيفيت سے پائیدیگی منیجر بنانا

لایک خواہش رکھتا ہوئے پائیدیگی منیجر بنانے کیلئے استعمال کریں position:fixed و bottom:0:

/* 导航栏 */
.navbar {
  position: fixed; /* 将导航栏设置为固定位置 */
  bottom: 0; /* 将导航栏置于页面底部 */
  width: 100%; /* 全宽 */
}
/* Main content */
.main {
  margin-bottom: 30px; /* 添加下外边距以避免内容重叠 */
}

خود کو کچھ کریں

مربوط پیج

تعلیم:CSS ناٹنگ بار