व्यवसायों और अन्य संगठनों के लिए वेबसाइट डिजाइन अक्सर अच्छी तरह से परिभाषित ब्रांडिंग और विपणन तत्वों को शामिल करते हैं। यदि आपकी वेबसाइट में एक वेब पेज है जिसे आप केंद्रित करना चाहते हैं, तो आप इसे HTML और CSS (कैस्केडिंग स्टाइल शीट) कोड के संयोजन का उपयोग करके स्वयं कर सकते हैं। कई डेवलपर वेब पेज तत्वों के लिए स्क्रॉलिंग गुणों का उपयोग केंद्रक गुणों को निर्देशित करने के लिए करते हैं, लेकिन यह हमेशा विश्वसनीय नहीं होता है। एक केंद्रित वेबसाइट लेआउट को परिभाषित करने के लिए और एक पृष्ठ जो स्क्रॉल सलाखों के बिना दिखाई देगा, कुछ सीएसएस घोषणाओं की आवश्यकता होती है।

1।

अपना HTML पेज बनाएं। यदि आपके पास एक पृष्ठ है जिस पर आप पहले से काम कर रहे हैं, तो उसे खोलें। अन्यथा एक पाठ संपादक में एक नई फ़ाइल बनाएं और इसे ".html" एक्सटेंशन के साथ सहेजें। निम्नलिखित रूपरेखा का उपयोग करें:

ध्यान दें कि पृष्ठ में सिर में सीएसएस कोड और शरीर में एक तत्व के लिए एक अनुभाग है। पृष्ठ की सामग्री को इस तत्व के अंदर रखा जाना चाहिए। यदि आप किसी मौजूदा पृष्ठ के साथ काम कर रहे हैं, तो इसके लिए CSS कोड का पता लगाएं, जो आपके पेज हेड से जुड़ी एक अलग CSS फ़ाइल में संग्रहीत किया जा सकता है।

2।

CSS में पेज कंटेनर को पहचानें। युक्त तत्व को स्टाइल करने के लिए, आपको सबसे पहले इसे CSS कोड में पहचानना होगा। अपने पेज हेड में स्टाइल सेक्शन में, या एक अलग फाइल में, यदि आप जो काम कर रहे हैं, उसमें निम्न चयनकर्ता और रूपरेखा जोड़ें:

कंटेनर {

}

यह "कंटेनर" के साथ इसकी आईडी विशेषता के रूप में तत्व की पहचान करता है। तत्व के लिए शैली की घोषणाएं उद्घाटन और समापन कोष्ठक के बीच दिखाई देंगी। वैकल्पिक रूप से, आप निम्न के रूप में एक वर्ग विशेषता मान का उपयोग कर तत्व की पहचान कर सकते हैं:

.कंटेनर {

}

यह निम्नलिखित तत्व की पहचान करेगा:

3।

अपनी सामग्री को केंद्रित करने के लिए तत्व के लिए एक निश्चित चौड़ाई लागू करें। अपने पृष्ठ के तत्वों को केंद्र में रखने के लिए, जिसमें तत्व की चौड़ाई निश्चित होनी चाहिए। निम्नानुसार "कंटेनर" तत्व के लिए CSS कोष्ठक के बीच एक जोड़ें:

चौड़ाई: 800px;

अपने डिजाइन के अनुरूप ऊंचाई मूल्य को बदल दें। अब आप मार्जिन प्रॉपर्टी लागू कर सकते हैं, जो तत्व को पेज के भीतर केन्द्रित करने के लिए मजबूर करेगी:

मार्जिन: ऑटो;

4।

तत्व को स्क्रॉल करने से रोकें। यदि आप पृष्ठ को स्क्रॉल नहीं करना चाहते हैं, तो आपको निम्न प्रकार से कंटेनर तत्व में एक ऊँची संपत्ति लगाने की आवश्यकता है:

ऊंचाई: 90%;

अपने डिजाइन के अनुरूप मूल्य को बदल दें। यदि कंटेनर के अंदर के तत्व इससे अधिक जगह घेरते हैं और आप स्क्रॉलिंग को रोकना चाहते हैं, तो आपको निम्न प्रकार से तत्व के अतिप्रवाह को छिपाने की आवश्यकता है:

छिपा हुआ सैलाब;

यह स्क्रॉल पट्टी को प्रदर्शित होने से रोक देगा भले ही आपकी पृष्ठ सामग्री उपयोगकर्ता के ब्राउज़र में आवंटित ऊंचाई से अधिक हो।

5।

अपना पृष्ठ सहेजें और देखें। इसे ब्राउज़र में खोलें या परिणाम देखने के लिए इसे अपनी साइट पर अपलोड करें। आपको अपने इच्छित डिज़ाइन पर आने के लिए समायोजन करने की आवश्यकता हो सकती है। यह सुनिश्चित करने के लिए कि आपके पास पूर्ण सामग्री होने के बाद आप पृष्ठ का परीक्षण करें, क्योंकि इसका स्वरूप काफी भिन्न हो सकता है।

टिप

• अलग-अलग वेब ब्राउज़र अलग-अलग तरीकों से सीएसएस नियमों को लागू करते हैं, इसलिए सुनिश्चित करें कि आप अपने पृष्ठों का एक से अधिक में परीक्षण करें।

चेतावनी

• वेब पेज तत्व के अतिप्रवाह को छिपाने से आपके कुछ उपयोगकर्ता आपके पेज की सभी सामग्री को देखने से रोक सकते हैं।