फिक्स्ड (यह पुस्तक खिड़की पर स्थिर रहता है) सीएसएस केवल का उपयोग कर ब्लॉक
इस पोस्ट में अंडे चूसना करने के लिए वाक्यांश "शिक्षण दादी" के लिए एक अच्छा उदाहरण हो सकता है ... क्योंकि यह सिर्फ बुनियादी सीएसएस सामग्री है हो सकता है. लेकिन उन लोगों के लिए, जैसे अनजान मुझे, इस भेष में एक वरदान हो सकता है. मैं हमेशा सोचा (मैं यह कह के लिए अपनी नौकरी खो सकता है), यह केवल करने के लिए संभव था HTML पृष्ठ स्थैतिक सामग्री के कुछ भाग को रखने के (अर्थ, अपनी स्थिति बनी हुई है के रूप में विंडो स्क्रॉल पर है), कुछ स्मार्ट स्क्रिप्ट का उपयोग कर, उन सभी वैज्ञानिक करना गणना गतिशील स्थिति को खोजने के लिए, Window.scroll घटनाओं को फँसाने और समय समाप्ति आदि की स्थापना
सोचा के रूप में इस के रूप में आसान कभी नहीं कर सकता .... यहाँ सीएसएस / HTML के नीचे में, मैं चार स्थिर ब्लॉक, एक पृष्ठ का प्रत्येक extrimities करने के लिए तय है, शीर्ष, सही नीचे, और वाम ... अनावश्यक कहने के लिए आप किसी एक या अधिक का चयन अगर होने की आवश्यकता कर सकते हैं ...
सीएसएस
स्थिर {प्रदर्शन: ब्लॉक; z-सूचकांक: 10; रंग: # FFFFFF, अतिप्रवाह-x: छुपा, अतिप्रवाह-y: छुपा, स्थिति: ixed;
}
# सामग्री {हाशिया: 150px 100px 160px 0px; सीमा: 1px ठोस e6e6e6 #}# लपेटो टी {शीर्ष: 0px; पृष्ठभूमि: 33CC66, चौड़ाई: 100%; ऊँचाई: 55px;}
# लपेटो l {शीर्ष: 80px; पृष्ठभूमि: ठोस 2px e6e6e6 # # FF9966, ऊँचाई: 300px;:; चौड़ाई 150px सीमा;
# लपेटो - ख {नीचे: 0px; पृष्ठभूमि: # 3333CC, चौड़ाई: 100%; ऊँचाई: 55px;}
# लपेटो-r {शीर्ष: 80px; पृष्ठभूमि: # 6666FF; ऊँचाई: 300px; चौड़ाई: 140px; सीमा: ठोस 2px e6e6e6, सही: 0;}
एचटीएमएल
<div id="contents"> आप मुख्य पृष्ठ </ div> सामग्री
<div id="wrap-b" class="static">
पेज के तल पर स्थिर सामग्री
</ Div>
<div id="wrap-t" class="static">
पृष्ठ शीर्ष पर स्थिर सामग्री
</ Div><div id="wrap-l" class="static">
पेज पर स्थिर सामग्री को छोड़ दिया
</ Div>
<div id="wrap-r" class="static">
पेज सही पर स्थिर सामग्री
</ Div>
