Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> CSS

CSS से नेविगेशन बार को वेब पेज के बॉटम पर फिक्स करें


नेविगेशन बार को बॉटम पर सेट करने के लिए, position: fixed प्रॉपर्टी का उपयोग bottom प्रॉपर्टी के साथ करें।

बॉटम पर रहने वाले मेनू को लागू करने के लिए निम्न कोड चलाकर देखें:

उदाहरण

<!DOCTYPE html> <html>    <head>       <style>          ul {             list-style-type: none;             position: fixed;             bottom: 0;             width: 100%;          }          li {             float: left;                border-right: 1px solid white;          }          li a {             display: block;             padding: 8px;             background-color: orange;          }          li:last-child {             border-right: none;          }          div {             padding:10px;             margin-top:10px;             background-color:white;             height:1000px;          }       </style>    </head>    <body>       <ul>          <li><a href = "#home">Home</a></li>          <li><a href = "#news">News</a></li>          <li><a href = "#contact">Contact</a></li>          <li><a href = "#about">About</a></li>       </ul>       <div>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>          <p>Adding demo text to check fixed menu.</p>       </div>    </body> </html>

  1. CSS से बॉटम नेविगेशन मेनू कैसे बनाएं? CSS से बॉटम नेविगेशन मेनू कैसे बनाएं?

    CSS से बॉटम नेविगेशन मेनू बनाने का कोड निम्नलिखित है:उदाहरण<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> &

  1. CSS के साथ ऑन-स्क्रॉल फिक्स्ड नेविगेशन बार कैसे बनाएं CSS के साथ ऑन-स्क्रॉल फिक्स्ड नेविगेशन बार कैसे बनाएं

    परिचय CSS position प्रॉपर्टी को निर्दिष्ट करके, हम CSS का उपयोग करके एक फिक्स्ड नेविगेशन बार बना सकते हैं जो स्क्रॉल पर फिक्स्ड हो जाता है। पोजिशन प्रॉपर्टी सिंटैक्स selector { position: static | relative | absolute | fixed | sticky; } उदाहरण: स्टिकी नेविगेशन बार = sticky) { nav.classLi

  1. Chrome for Android में मेनू बार को नीचे कैसे ले जाएं Chrome for Android में मेनू बार को नीचे कैसे ले जाएं

    आपके फोन पर कई अन्य ब्राउज़रों की तरह, Google Chrome ब्राउज़र पर URL और मेनू बार शीर्ष पर है। हालांकि, Google Chrome का एक हालिया बिल्ड आपको मेनू बार को स्क्रीन के नीचे ले जाने की अनुमति देता है। यह एक हाथ से फोन का उपयोग करने वालों के लिए अधिक सुविधाजनक है। यहां बताया गया है कि आप Chrome स्क्रीन के