टेक्स्ट-इंडेंट प्रॉपर्टी आणि जवळच्या सिब्बल निवडर्सचा वापर करणे
चांगले वेब डिझाइन बहुधा चांगली टायपोग्राफीबद्दल असते. वेबपृष्ठाच्या खूप सामग्री मजकूर म्हणून प्रस्तुत केल्यामुळे, मजकूर आकर्षक व परिणामकारक दोन्ही बनण्यासाठी सक्षम होण्यापासून वेब डिझायनर म्हणून राहण्यासाठी एक महत्वाची कौशल्य आहे. दुर्दैवाने, प्रिंटमध्ये आपण जे टाइपोग्राफिक नियंत्रण ऑनलाइन करतो ते समान स्तर नाही. याचाच अर्थ असा की आम्ही मुद्रित भागामध्ये अशा प्रकारे करू शकू त्याचप्रमाणे वेबसाइटवर कायमस्वरूपी मजकूर ठेवू शकत नाही.
एक सामान्य परिच्छेद शैली जी आपण बर्याचदा प्रिंटमध्ये पहाता (आणि आम्ही ऑनलाइन पुन्हा तयार करू शकतो) जिथे त्या परिच्छेदाची पहिली ओळ एक टॅब स्पेस इंडेंट करीत आहे. हे वाचकांना एक परिच्छेद सुरू होते आणि दुसरा मार्ग कुठे आहे हे पाहण्याची अनुमती देते.
आपल्याला या व्हिज्युअल शैलीला जास्त वेब पृष्ठे दिसत नाहीत कारण ब्राउझरमध्ये डिफॉल्टनुसार पॅराग्राफमध्ये स्पेअरसह स्पेस दाखविण्याची पद्धत असते, जिथे एक सिरा आणि दुसरे सुरू होते, परंतु जर आपण त्या पृष्ठावर मुद्रण-प्रिंट करायचा असेल तर, परिच्छेदांवर प्रेरणागत इंडेंट शैली, आपण मजकूर-इंडेंट शैली मालमत्तेसह करु शकता.
या मालमत्तेसाठी सिंटॅक्स हे सोपे आहे. अशा प्रकारे आपण डॉक्युमेंटमध्ये सर्व परिच्छेदांना टेक्स्ट-इंडेंट जोडू शकता.
पी {मजकूर-इंडेंट: 2em; }इंडेंट्स सानुकूल करणे
आपण इंडेंटला तंतोतंत परिच्छेद निर्दिष्ट करू शकता असे एक मार्ग, आपण ज्या पट्टांवरील इंडेंट इच्छित आहात त्याला एक वर्ग जोडू शकता, परंतु त्यासाठी आपण त्यास एक श्रेणी जोडण्यासाठी प्रत्येक परिच्छेद संपादित करणे आवश्यक आहे. हे अकार्यक्षम आहे आणि एचटीएमएल कोडिंग सर्वोत्तम पद्धतींचे पालन करीत नाही.
त्याऐवजी, आपण परिच्छेद इंडेंट केल्यावर विचार करावा. आपण इंडेन्ट परिच्छेद थेट थेट दुसर्या परिच्छेदाचे अनुसरण करीत आहात. हे करण्यासाठी, आपण शेजारच्या सिब्बल निवडकर्त्याचा वापर करू शकता. या निवडकर्त्यासह, आपण प्रत्येक परिच्छेद निवडत आहात जे लगेच दुसर्या परिच्छेदाद्वारे पुढे आहे.
p + p {text-indent: 2em; }आपण पहिल्या ओळीत इंडेंट करीत असल्यामुळे, आपल्या परिच्छेदांना त्यांच्या दरम्यान आणखी स्पेस नाही याची खात्री करुन घ्या (जे ब्राउझर डीफॉल्ट आहे). Stylistically, आपण एकतर परिच्छेद किंवा पहिल्या ओळीत इंडेंट दरम्यान जागा असणे आवश्यक आहे, परंतु दोन्ही नाही.
पी {समास-तळ: 0; पॅडिंग-तळ: 0; } p + p {मार्जिन-टॉप: 0; पॅडिंग-टॉप: 0; }नकारात्मक इंडेंट
आपण सामान्य इंडेंट सारख्या उजवीकडे विरोध म्हणून डाव्या बाजूला जाण्यासाठी एक ओळ सुरू करण्यासाठी कारण, एक नकारात्मक मूल्य सोबत मजकूर-इंडेंट मालमत्तेचा वापर करू शकता. आपण असे करू शकता जर एखादी रेखा अवतरण चिन्हाने सुरू होते ज्यामुळे कोट अक्षरे परिच्छेदच्या डाव्या बाजूस असलेल्या थोडा फरकाने दिसतील आणि अक्षरे स्वतः एक चांगले डावे संरेखन देखील तयार करतील.
उदाहरणादाखल सांगा, तुमच्याकडे एक पॅराग्राफ आहे जो ब्लॉककोटचे वंशज आहे आणि आपण ती नकारात्मकपणे इंडेंट करू इच्छित आहात. आपण हे CSS लिहू शकता:
ब्लॉककोट पी {मजकूर-इंडेंट: -5म; }हे अनुच्छेद सुरू करेल, ज्यात संभाव्यपणे सुरुंग कोट अक्षर समाविष्ट होते, हँगिंग विरामचिन्ह तयार करण्यासाठी डावीकडे किंचित हलविले जाऊ शकते.
मार्जिन व पॅडिंग बाबत
बर्याच वेळा वेब डिझाइनमध्ये, घटक हलविण्यासाठी आणि पांढरे स्थान तयार करण्यासाठी आपण समास किंवा पॅडिंग मूल्ये वापरता. जे गुणधर्म इंडेंट करणार्या परिच्छेदाच्या परिणामासाठी कार्य करणार नाहीत, तथापि जर आपण या मूल्यांपैकी एकतर परिच्छेदात अर्ज केला असेल, तर प्रत्येक ओळसह सर्व परिच्छेद, त्या परिच्छेदाचा संपूर्ण मजकूर फक्त पहिल्या ओळीच्या ऐवजी अंतरावर असेल.