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

सीएसएस स्थिति की भूमिका:चिपचिपा;

<घंटा/>

चिपचिपा नावबार बनाने के लिए, स्थिति का उपयोग करें:चिपचिपा; संपत्ति। चिपचिपा नावबार बनाने के लिए आप निम्न कोड चलाने का प्रयास कर सकते हैं,

उदाहरण

<!DOCTYPE html>
<html>
   <head>
      <style>
         ul {
            list-style-type: none;
            position: sticky;
            overflow: hidden;
            top: 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:5px;
            margin-top:5px;
            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 स्थिति को लागू करने के लिए निम्न कोड चलाने का प्रयास कर सकते हैं:सापेक्ष; उदाहरण <!DOCTYPE html> <html>    <head>       <style>     &

  1. सीएसएस स्थिति:स्थिर;

    स्थिति:स्थिर; संपत्ति एक स्थिर तत्व की स्थिति निर्धारित करती है, जो कि डिफ़ॉल्ट है। उदाहरण ऊपर, नीचे, बाएँ और दाएँ गुण स्थिर स्थित तत्वों को प्रभावित नहीं करते हैं। आप सीएसएस को लागू करने के लिए निम्न कोड चलाने का प्रयास कर सकते हैं स्थिति:स्थिर; संपत्ति <!DOCTYPE html> <html>   &n

  1. सीएसएस स्थिति:निश्चित;

    स्थिति:निश्चित; संपत्ति आपको व्यूपोर्ट के सापेक्ष तत्व की स्थिति की अनुमति देती है। आप सीएसएस स्थिति को लागू करने के लिए निम्न कोड चलाने का प्रयास कर सकते हैं:निश्चित; उदाहरण <!DOCTYPE html> <html>    <head>       <style>         &