2012-03-17 15 views
23

क्या ट्विटर के बूटस्ट्रैप प्रोजेक्ट के लिए लंबवत लय बनाए रखने के लिए कोई मौजूदा प्लगइन/एक्सटेंशन/विधियां हैं?ट्विटर के बूटस्ट्रैप के लिए लंबवत ताल

यह अच्छा वर्टिकल लय टेम्पलेट बनाने के लिए काफी श्रमिक कार्य है, मैं एक पूर्व-बेक्ड समाधान का उपयोग करता हूं। मैं रचनात्मक सुझावों के लिए खुला हूं, मैं बस अपने पृष्ठों को अंत में अच्छी तरह से गठबंधन करना चाहता हूं।


संपादित करें: स्पष्ट करने के लिए मैं क्या के बाद हूँ ...

कार्यक्षेत्र लय सुनिश्चित करना है कि एक क्षैतिज ग्रिड के अनुसार एक पेज लाइनें पर हर तत्व का इस्तेमाल किया एक तकनीक है। यह मानक इकाई लाइन आकार के अनुरूप प्रत्येक आइटम की ऊंचाई, पैडिंग और मार्जिन सेट करके हासिल किया जाता है। यदि अनुच्छेद में पाठ की एक पंक्ति 20px ऊंची है (मार्जिन और पैडिंग समेत) तो हो सकता है कि एक शीर्षक 4 भी 20px ऊंचा हो, और शीर्षक 1 40px ऊंचा हो सकता है। यह कॉलम भर में पाठ की लय बनाए रखता है।

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

मैं ऊर्ध्वाधर लय के लिए एक सामान्य समाधान के साथ शुरू कर सकता हूं, जो मुझे प्राप्त करने के लिए एक लंबा रास्ता तय करेगा, लेकिन मैं जानना चाहता था कि किसी और ने इसे शुरू किया है, या इसे प्राप्त करने के किसी अन्य तरीके का कोई विचार है।


संपादित करें: मान लिया जाये कि जो मैं चाहता की तरह कुछ भी नहीं है ...

हो सकता है कि सिर्फ एक अच्छा ऊर्ध्वाधर-ताल आधारित सीएसएस टेम्पलेट एक अच्छा प्रारंभिक बिंदु होगा। अधिमानतः कुछ विकसित होना जारी है, पहले से ही प्रयोग योग्य, अच्छी तरह से सोचा, और अनुकूलनीय है।

+0

तथ्य यह है कि आपके पास कोई बकाया होने के बावजूद कोई भी उत्तर नहीं दिया। आपका प्रश्न बहुत विशिष्ट है। आपको अधिक जानकारी देने की आवश्यकता है: आप क्या हासिल करने की कोशिश कर रहे हैं? आपने अब तक क्या किया है? आदि – HerrSerker

+2

मुझे नहीं लगता कि 'लंबवत लय टेम्पलेट्स' एक उद्योग शब्द है इसलिए कोई भी नहीं जानता कि आप किस बारे में बात कर रहे हैं। –

+0

मुझे नहीं लगता कि लोग जो समझ रहे हैं उसे समझ सकते हैं ... –

उत्तर

7

के बाद से कोई भी एक वास्तविक ऊर्ध्वाधर लय बॉयलरप्लेट से जुड़ा हुआ है के रूप में आप का सुझाव दिया है, मैं एक का उपयोग मैं ले लिया है, यह टिप्पणी की, और यहाँ https://github.com/jonschlinkert/vertical-rhythm

इसके लिए एक GitHub रेपो बनाया यह रीडमी में कहते हैं, इस के रूप में अपने स्वयं के प्रोजेक्ट के लिए एक शुरुआती बिंदु है।

5

मुझे लगता है कि आप क्या कर रहे हैं समझा जाता है। समस्या यह है: आप एक आयाम में एक ग्रिड स्कीमा की तलाश कर रहे हैं (उदाहरण के लिए, "लंबवत लय" सेट, आनुपातिक रेखा ऊंचाई ... जो किसी दिए गए पृष्ठ के साथ बोलने, उपायों और संरेखित करने के तरीके में वाई अक्ष) ... लेकिन इस तरह से चीजें करने से संभावित रूप से बूटस्ट्रैप के पूर्व-मौजूदा 12-कॉलम ग्रिड सिस्टम (जो इसके विपरीत, पृष्ठ के एक्स अक्ष के साथ चीजों को मापता है और संरेखित करता है) के साथ बाधाओं में हो सकता है। आप ढांचे में प्रत्येक "पंक्ति" की ऊंचाई को "आनुपातिक" करना चाहते हैं। लेकिन: ध्यान रखें, बूटस्ट्रैप का डिज़ाइन कॉलम के माध्यम से केवल आनुपातिकता को बढ़ावा देने के लिए नहीं है, बल्कि पृष्ठ उत्तरदायी --ie पृष्ठ पृष्ठों को एक दूसरे के चारों ओर "प्रवाह" करने की अनुमति देने के लिए लंबवत, और घोंसला घोंसला करने के लिए। और, उस अर्थ में, वाई अक्ष के साथ मापा तत्वों की ऊंचाई से संबंधित मुद्दों को पहले ही माना जा सकता है ... मुझे याद है कि बेस सीएसएस फ़ाइल में अधिकांश टाइपोग्राफिक तत्वों में आनुपातिक एम आकार होते हैं, और/या इसी तरह आनुपातिक शीर्ष और नीचे पैडिंग, इत्यादि। आम तौर पर, चीजें इतनी मनमानी नहीं होती हैं कि ढांचा आपके द्वारा विचार किए जा रहे तरीके से अतिरिक्त स्टाइल की आवश्यकता को चिल्लाता है।

यहां तक ​​कि: बूटस्ट्रैप की मूल सीएसएस फ़ाइल इतनी असहनीय रूप से व्यापक नहीं है कि आपके लिए बहुत अधिक परेशानी के बिना विभिन्न तत्व वर्गों और आईडी की ऊंचाई को ट्विक करना असंभव होगा। किसी भी मामले में, यह बेहद असंभव है कि आपको वास्तव में हर स्टाइल तत्व के साथ ऐसा करने की आवश्यकता होगी, है ना? वास्तव में, एक ढांचे के रूप में, बूटस्ट्रैप में कई तत्वों के लिए स्टाइल शामिल है जो ऐप में भी नहीं हो सकते हैं जिसके लिए आप फ्रंट एंड डिज़ाइन कर रहे हैं। (उदाहरण: क्या आपके ऐप ने मेनू को छोड़ दिया है? बढ़िया। आप ड्रॉप डाउन मेनू के "ऊर्ध्वाधर लय" को शैलीबद्ध कर सकते हैं। लेकिन: क्या आप अपने नेविगेशन बार में गोले या टैब का भी उपयोग कर रहे हैं? कोई गोलियाँ नहीं, आप कहते हैं?खैर, आप स्टाइलशीट में कोड की कुछ सौ लाइनों को हटा सकते हैं और अपने अनियंत्रित तत्वों को अपने "ऊर्ध्वाधर लय" को लागू करने का प्रयास स्वयं को बचा सकते हैं।) इसी तरह, उन तत्वों के लिए जो आप रहते हैं और वास्तव में करते हैं आवश्यकता है, लाइन ऊंचाई, शीर्ष और नीचे पैडिंग, मार्जिन, फ़ॉन्ट आकार, आदि के लिए मानों को खोजने के लिए बस एक टेक्स्ट एडिटर का उपयोग करें ... और इसका परीक्षण करें। एक सीएसएस ढांचे के रूप में, यह स्पष्ट है कि बूटस्ट्रैप कैसे निर्धारित किया जाता है; प्रासंगिक तत्वों को अच्छी तरह से क्रमबद्ध किया जाता है, और अधिकांश भाग के लिए स्टाइलशीट कोड के भीतर एक साथ समूहीकृत किया जाता है। एक बार जब आप बेस सीएसएस फ़ाइल का पूरा ट्विकिंग कर लेंगे, तो बस अपनी संशोधित स्टाइलशीट को कम करें ... पूर्व-मौजूदा minified संस्करण को प्रतिस्थापित करने के लिए ... या, शायद, अगर आप अनुकूलित करना चाहते हैं तो बस क्लाउडफ्रंट से इसे सेवा दें।

+5

मैन। वे उन मोनोलिथिक पैराग्राफ हैं। क्या हमें यकीन है कि ग्रू रूएन के रहस्य उन हाइरोग्लिफ में छिपे नहीं हैं? संक्षेप में, कृपया अपने अनुच्छेदों को थोड़ा और अधिक तोड़ दें। –

2

क्या आपने स्क्वायर ग्रिड सीएसएस ढांचे को देखा है?

http://thesquaregrid.com/

डिजाइनरों और डेवलपर्स के लिए एक सरल सीएसएस ढांचे, 35 बराबर-चौड़ाई कॉलम के आधार पर। इसका उद्देश्य विकास के समय में कटौती करना और की मदद करना है, जिससे आप सुंदर-संरचित वेबसाइटें बनाते हैं।

स्क्वायर ग्रिड एक मानक क्षैतिज ग्रिड प्रदान करता है, लेकिन यह 28px के मानक "वर्ग" का उपयोग करके लंबवत ग्रिड भी बनाए रखता है। यह वास्तव में सिर्फ एक ग्रिड है, बूटस्ट्रैप की तरह पूर्ण सीएसएस लाइब्रेरी नहीं है (यानी कोई बटन, मेनू, आदि)।

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

आप दोनों को गठबंधन करने में सक्षम हो सकते हैं, या कम से कम स्क्वायर ग्रिड स्रोत कोड पर एक नज़र डालें जो कि आपकी आवश्यकताओं को पूरा करने के लिए बूटस्ट्रैप को अनुकूलित करने के तरीके पर कुछ विचार प्राप्त करने के लिए बहुत ही सरल सीएसएस है।

+0

कंपास + संदिग्ध भी लंबवत ताल का समर्थन करते हैं – Evgeny

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