2010-05-11 12 views
11

मैं पृष्ठ के नीचे "सभी अधिकार सुरक्षित ..." रेखा डालना चाहता हूं। मैंने पूर्ण स्थिति का उपयोग करने की कोशिश की, लेकिन जब खिड़की छोटी ऊंचाई पर बदल गई तो यह अपेक्षित काम नहीं करता है।पृष्ठ के निचले हिस्से में टेक्स्ट कैसे चिपकाएं?

मैं इस सरल लक्ष्य को कैसे प्राप्त कर सकता हूं?

+0

वास्तव में "अपेक्षित रूप से काम नहीं करता" क्या है? – RoToRa

+0

कोई भी कोड exmaple हम साथ काम कर सकते हैं? – Flatlin3

+0

"पृष्ठ के नीचे" के साथ आपका क्या मतलब है? इसके लिए आप इसे HTML कोड के नीचे बस जोड़ देंगे। लेकिन ऐसा लगता है कि आप इसे पृष्ठ के बजाय * विंडो * के नीचे रखा जाना चाहते हैं। (यदि पृष्ठ स्क्रॉल किया गया है या खिड़की का आकार बदल गया है, तो उसे हमेशा निचली विंडो सीमा तक चिपका जाना चाहिए। (क्या आप यही चाहते हैं?) – chiccodoro

उत्तर

16

आप एक अपेक्षाकृत गठबंधन कंटेनर में पूरी तरह से गठबंधन div डाल करने के लिए चाहते हो सकता है - इस तरह से यह अभी भी कंटेनर के बजाय ब्राउज़र विंडो में निहित कर दिया जाएगा।

<div style="position: relative;background-color: blue; width: 600px; height: 800px;">  

    <div style="position: absolute; bottom: 5px; background-color: green"> 
    TEST (C) 2010 
    </div> 
</div> 
1

मैंने उपयोग किया है कि ryanfait.com पर एक उत्कृष्ट चिपचिपा पाद लेख है, और this one भी वादा करता है।

14

प्रयास करें:

.bottom { 
    position: fixed; 
    bottom: 0; 
} 
6

इस

<head> 
<style type ="text/css" > 
    .footer{ 
     position: fixed;  
     text-align: center;  
     bottom: 0px; 
     width: 100%; 
    } 
</style> 
</head> 
<body> 
    <div class="footer">All Rights Reserved</div> 
</body> 
+0

मैंने इसे केंद्र में बनाने के विचार को ध्यान में रखते हुए इसे संपादित करने के लिए संपादित किया, क्योंकि मुझे इसकी भी आवश्यकता थी। उम्मीद है कि अन्य लोगों को भी यह उपयोगी लगेगा। –

+0

आपने अपना समय बचाया, बहुत बहुत धन्यवाद। –

0

एक पुरानी धागा प्रयास करें, लेकिन ... Konerak का जवाब काम करता है, लेकिन क्यों तुम भी डिफ़ॉल्ट रूप से एक कंटेनर के आकार को निर्धारित करेगा। जो भी मैं preffer कोड का उपयोग करना है जहां भी होग बड़ा पेज आकार कोई फर्क नहीं पड़ता। तो यह मेरे कोड:

<style> 
    #container { 
    position: relative; 
    height: 100%; 
} 
#footer { 
    position: absolute; 
    bottom: 0; 
} 
</style> 

</HEAD> 

<BODY> 

<div id="container"> 

    <h1>Some heading</h1> 

<p>Some text you have</p> 

<br> 
<br> 

<div id="footer"><p>Rights reserved</p></div> 

</div> 

</BODY> 
</HTML> 

चाल <br> जहां नई लाइन को तोड़ने में है। इसलिए, जब पृष्ठ छोटा होता है तो आप पृष्ठ के निचले हिस्से में पाद लेख देखेंगे, जैसा आप चाहते हैं।

लेकिन जब कोई पृष्ठ बड़ा होता है तो आपको इसे नीचे स्क्रॉल करना होगा, फिर आपका पाद लेख ऊपर की पूरी सामग्री के तहत 2 नई लाइनें होने जा रहा है। और यदि आप पेज को बड़ा बना देंगे, तो आपका पाद लेख हमेशा नीचे जा रहा है। मुझे आशा है कि किसी को यह उपयोगी लगेगा।

संबंधित मुद्दे

 संबंधित मुद्दे