सीएसएससह एचटीएमएलमधील घटकांची रचने आणि भौतिक विभेदन तयार करा
एचटीएमएलमधील घटकांची मोकळी जागा आणि भौतिक विभेदन करणे सुरुवातीला वेब डिझायनरसाठी समजणे कठीण होऊ शकते. कारण एचटीएमएलमध्ये संपत्ती आहे ज्याला "मोकळी जागा संकुचित" असे म्हटले जाते. आपण आपल्या HTML कोडमध्ये 1 स्पेस किंवा 100 टाइप केल्यास, वेब ब्राऊझर त्या स्पेस खाली एका एकल स्थानापर्यंत आपोआप कोसळते. हे मायक्रोसॉफ्ट वर्ड सारखे प्रोग्रॅमपेक्षा वेगळं आहे, जे डॉक्युमेंट निर्मात्यांना त्या डॉक्युमेंट्सच्या शब्द आणि इतर घटक विभक्त होण्यास मोकळी जागा जोडण्याची परवानगी देते.
वेबसाइट डिज़ाइनमधील अंतर कसे कार्य करते हे नाही.
तर, आपण वेब पृष्ठावर दर्शविलेल्या HTML मध्ये व्हाइसस्पेसेस कसे जोडाल? या लेखात काही भिन्न पद्धतींची तपासणी केली जाते.
CSS सह HTML मध्ये स्थाने
आपल्या HTML मध्ये स्थाने जोडण्याचा प्राधान्यक्रम म्हणजे कॅस्केडिंग स्टाईल शीट्स (सीएसएस) . वेबपेजच्या कोणत्याही व्हिज्युअल पैलू जोडण्यासाठी सीएसएस वापरला जावा आणि स्पेसिंग व्हिज्युअल डिज़ाइन वैशिष्ट्याचा एक भाग असल्याने, सीएसएस म्हणजे जिथे आपण हे केले पाहिजे.
सीएसएस मध्ये, तुम्ही मार्जिन किंवा पॅडिंगचे गुणधर्म वापरू शकता त्यातील घटकांची भोवताली जागा जोडा. याव्यतिरिक्त, मजकूर-इंडेंट गुणधर्म मजकूरच्या पुढील भागास जोडतो, जसे की परिच्छेदाचा अंतर्भाव करणे.
आपल्या सर्व परिच्छेदांपुढे जागा जोडण्यासाठी सी.एस.एस. चा वापर कसा करायचा याचे एक उदाहरण आहे. आपल्या बाह्य किंवा अंतर्गत शैली पत्रकावर खालील CSS जोडा:
पी {
मजकूर-इंडेंट: 3em;
}
HTML मध्ये रिक्त स्थाने: आपल्या मजकूर आत
आपण आपल्या मजकूरासाठी फक्त एक अतिरिक्त जागा किंवा दोन जोडू इच्छित असल्यास, आपण नॉन-ब्रेकिंग स्पेस वापरू शकता
हे पात्र मानक स्पेस वर्णाप्रमाणे कार्य करते, केवळ ते ब्राउझरमध्ये कोसळू शकत नाही.
मजकूराच्या ओळीमध्ये पाच स्थाने कशी जोडायची हे उदाहरण आहे:
या मजकूराच्या आतल्या पाच अतिरिक्त रचने आहेत
HTML वापरते:
हा मजकूर आहे & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; त्यातील पाच अतिरिक्त जागा
आपण अतिरिक्त ओळ खंड जोडण्यासाठी
टॅग देखील वापरू शकता
या वाक्याच्या शेवटी पाच ओळी आहेत
HTML मध्ये अंतर का खराब आयडिया आहे
हे पर्याय दोन्ही कार्य करताना - बिगर ब्रेकिंग स्पेस घटक खरंच आपल्या मजकूरास अंतर जोडेल आणि लाईन ब्रेक वर दर्शविलेल्या परिच्छेद खाली अंतर जोडेल - हे आपल्या वेबपेजमधील अंतर तयार करण्याचा सर्वोत्तम मार्ग नाही. आपल्या HTML मध्ये हे घटक जोडणे दृश्यमान शैली (सीएसएस) मधून एका पृष्ठाच्या (एचटीएमएल) संरचनेच्या ऐवजी कोडमध्ये दृश्य माहिती जोडते. सर्वोत्कृष्ट पद्धतींनी हे सुचविते की हे भविष्यातील अद्यतने आणि संपूर्ण फाइल आकार आणि पृष्ठाच्या कार्यक्षमतेसह सहजपणे यासह अनेक कारणांसाठी वेगळे असावे.
आपण आपल्या सर्व शैली आणि अंतर निर्देशित करण्यासाठी बाह्य शैली पत्रक वापरत असल्यास, संपूर्ण साइटसाठी त्या शैली बदलणे सोपे आहे, कारण आपल्याला त्या एक शैली पत्रक अद्यतनित करावे लागतात.
त्यातील शेवटचे उदाहरण पाच लांबीच्या पाच वाक्यांत पाहा. आपल्याला जर प्रत्येक परिच्छेदाच्या तळाशी अंतर ठेवायचे असेल तर आपल्याला आपल्या संपूर्ण साइटमधील प्रत्येक परिच्छेदांना तो HTML कोड जोडावा लागेल. ती अतिरिक्त मार्कअपची योग्य रक्कम आहे जी आपल्या पृष्ठांना फहरेल.
याव्यतिरिक्त, आपण रस्ता ठरवल्यास हा अंतर खूप किंवा खूप कमी आहे, आणि आपण तो थोडा बदलू इच्छित असाल तर आपल्याला आपल्या संपूर्ण वेबसाइटमधील प्रत्येक परिच्छेदाचे संपादन करण्याची आवश्यकता आहे. नको, धन्यवाद!
या स्पेसिंग एलिमेंटस आपल्या कोडमध्ये जोडण्याऐवजी, सीएसएस वापरा.
पी {
पॅडिंग-तळ: 20 पीएक्स;
}
त्या सीएसएस च्या एक ओळ तुमच्या पृष्ठाच्या परिच्छेदाखालील अंतर जोडेल. आपण भविष्यात त्या अंतर बदलू इच्छित असल्यास, ही एक ओळ संपादित करा (आपल्या संपूर्ण साइटच्या कोडऐवजी) आणि आपण पुढे जाऊ शकता!
आता, जर आपण आपल्या वेबसाइटच्या एका भागात एक स्पेस जोडण्याची आवश्यकता असेल तर
टॅग किंवा एकाच नॉन-ब्रेकिंग स्पेस वापरून जगाचा अंत नाही, परंतु आपल्याला सावधगिरीची गरज आहे.
हे इनलाइन HTML स्पेसिंग पर्याय वापरणे एक निसरडा उतार असू शकते. एक किंवा दोन आपल्या साइटला दुखापत नसले तरीही, आपण त्या मार्गावर चालत राहिलात तर आपल्या पृष्ठांवर समस्या आल्याल. सरतेशेवटी, आपण HTML स्पेसिंगसाठी सीएसएसकडे वळण्यापेक्षा आणि इतर सर्व वेबपृष्ठ व्हिज्युअल गरजेनुसार चांगले आहात.