फाउंडेशन - बेस टाइपोग्राफी

विवरण

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

निम्न तालिका फाउंडेशन में प्रयुक्त टाइपोग्राफी के विभिन्न प्रकारों को सूचीबद्ध करती है -

अनु क्रमांक।	टाइपोग्राफी और विवरण
1	पैराग्राफ पैराग्राफ विभिन्न फ़ॉन्ट आकार, हाइलाइट किए गए शब्द, लाइन ऊंचाई आदि के साथ परिभाषित वाक्यों का एक समूह है।
2	हैडर यह एच 1 से एच 6 तक एचटीएमएल हेडिंग को परिभाषित करता है।
3	लिंक यह एक हाइपरलिंक बनाता है जो पाठ या छवि पर क्लिक करने पर एक और दस्तावेज़ खोलता है।
4	परकार इसका उपयोग <hr> टैग का उपयोग करके अनुभागों के बीच एक विराम देने के लिए किया जाता है।
5	आदेशित और अनियोजित सूचियाँ फाउंडेशन समर्थित सूचियों, चीजों को सूचीबद्ध करने के लिए अनियंत्रित सूचियों का समर्थन करता है।
6	परिभाषा सूची नाम सूची जोड़े को प्रदर्शित करने के लिए परिभाषा सूचियों का उपयोग किया जाता है।
7	ब्लॉक उद्धरण यह पाठ के ब्लॉक का प्रतिनिधित्व करता है, जो सामान्य से बहुत बड़ा परिभाषित करता है।
8	संकेतन और कोड संक्षिप्तिकरण शब्द या वाक्यांश का एक छोटा शब्द परिभाषित करता है और कोड कोड का एक टुकड़ा दर्शाता है।
9	कीस्ट्रोक इसका उपयोग किसी विशिष्ट कार्य को करने के लिए किया जाता है।
10	सरल उपयोग फाउंडेशन पेज की सामग्री तक पहुंचने के लिए कुछ दिशानिर्देश प्रदान करता है।

सैस संदर्भ

आप तालिका में सूचीबद्ध एसएएस चर का उपयोग करके घटकों की शैली बदल सकते हैं।

नीचे दिए गए एसएएस चर का उपयोग करके घटकों की शैली दी गई है।

अनु क्रमांक।	नाम और विवरण	प्रकार	डिफ़ॉल्ट मान
1	$header-font-family शीर्ष लेख तत्वों के लिए फ़ॉन्ट परिवार निर्दिष्ट करता है।	स्ट्रिंग या सूची	$ शरीर-font-family
2	$header-font-weight हेडर का फ़ॉन्ट वजन निर्दिष्ट करता है।	तार	$ वैश्विक वजन सामान्य से
3	$header-font-style हेडर की फ़ॉन्ट शैली प्रदान करता है।	तार	साधारण
4	$font-family-monospace फॉन्‍ट स्‍टैक का उपयोग उन तत्‍वों के लिए किया जाता है जो कि कोड नमूने के रूप में मोनोसप्‍ट प्रकार का उपयोग करते हैं।	स्ट्रिंग या सूची	कॉन्सोलस, 'लिबरेशन मोनो', कूरियर, मोनोस्पेस
5	$header-sizes शीर्षकों के स्क्रीन आकार को परिभाषित करता है और प्रत्येक कुंजी एक ब्रेकपॉइंट है, और प्रत्येक मान शीर्षकों के आकार का एक मानचित्र है।	नक्शा	`small: ( 'h1': 24 'h2': 20 'h3': 19 'h4': 18 'h5': 17 'h6': 16 ) medium: ( 'h1': 48 'h2': 40 'h3': 31 'h4': 25 'h5': 20 'h6': 16 )`
6	$header-color हेडर का रंग प्रदान करता है।	रंग	इनहेरिट
7	$header-lineheight हेडर की लाइन ऊंचाई को परिभाषित करता है।	संख्या	1.4
8	$header-margin-bottom हेडर के नीचे मार्जिन प्रदान करता है।	संख्या	0.5rem
9	$header-text-rendering पाठ प्रतिपादन के लिए विधि को परिभाषित करता है।	तार	optimizeLegibility
10	$small-font-size <Small> तत्वों के लिए फ़ॉन्ट आकार निर्दिष्ट करता है।	संख्या	80%
1 1	$paragraph-margin-bottom पैराग्राफ के निचले मार्जिन को निर्दिष्ट करता है।	संख्या	1rem
12	$paragraph-text-rendering पाठ रेंडरिंग पैराग्राफ के लिए तरीके।	तार	optimizeLegibility
13	$code-color नमूनों को कोड करने के लिए पाठ रंग प्रदान करता है।	रंग	$ काला
14	$code-font-family कोड नमूने के लिए फ़ॉन्ट परिवार प्रदान करता है।	स्ट्रिंग या सूची	$ Font-family-monospace
15	$code-border कोड के चारों ओर सीमा निर्दिष्ट करता है।	सूची	1px ठोस $ मध्यम-ग्रे
16	$code-padding पाठ के चारों ओर पैडिंग निर्दिष्ट करता है।	संख्या या सूची	रेम-कैल्क (2 5 1)
17	$anchor-color लिंक के लिए डिफ़ॉल्ट रंग।	रंग	$ प्राथमिक रंग
18	$anchor-color-hover होवर पर लिंक के लिए डिफ़ॉल्ट रंग निर्दिष्ट करता है।	रंग	पैमाने-रंग ($ लंगर-रंग, $ लपट: -14%)
19	$anchor-text-decoration लिंक के लिए डिफ़ॉल्ट पाठ सजावट।	तार	कोई नहीं
20	$anchor-text-decoration-hover होवर पर लिंक के लिए डिफ़ॉल्ट पाठ सजावट।	तार	कोई नहीं
21	$hr-width विभक्त की अधिकतम चौड़ाई को परिभाषित करता है।	संख्या	$ वैश्विक-चौड़ाई
22	$hr-border विभक्त के लिए डिफ़ॉल्ट सीमा निर्दिष्ट करता है।	सूची	1px ठोस $ मध्यम-ग्रे
23	$hr-margin विभक्त के लिए डिफ़ॉल्ट मार्जिन।	संख्या या सूची	रेम-कैल्क (20) ऑटो
24	$list-lineheight यह एक सूची में वस्तुओं के लिए लाइन ऊंचाई को परिभाषित करता है।	संख्या	$ पैरा-lineheight
25	$list-style-type अनियंत्रित सूचियों के लिए बुलेट प्रकार प्रदान करता है।	तार	डिस्क
26	$list-style-position यह अनियंत्रित सूचियों पर गोलियों के लिए स्थिति को परिभाषित करता है।	तार	बाहर
27	$list-side-margin बाईं ओर (या दाएं) मार्जिन को परिभाषित करता है।	संख्या	1.25rem
28	$defnlist-term-weight <Dt> तत्वों के लिए फ़ॉन्ट वजन प्रदान करता है।	तार	$ वैश्विक वजन-बोल्ड
29	$defnlist-term-margin-bottom <Dt> और <dd> तत्वों के बीच रिक्ति प्रदान करता है।	संख्या	0.3rem
30	$blockquote-color यह <blockquote> तत्वों का पाठ रंग लागू करता है।	रंग	$ काले ग्रे
31	$blockquote-padding एक <blockquote> तत्वों के अंदर पैडिंग प्रदान करता है।	संख्या या सूची	रेम-कैल्क (९ २० ० १ ९)
32	$blockquote-border यह <blockquote> तत्वों के लिए साइड बॉर्डर देता है।	सूची	1px ठोस $ मध्यम-ग्रे
33	$cite-font-size <Cite> तत्वों के लिए फ़ॉन्ट आकार को परिभाषित करता है।	संख्या	रेम-calc (13)
34	$cite-color `<cite>`तत्वों के लिए पाठ रंग प्रदान करता है ।	रंग	$ काले ग्रे
35	$keystroke-font <Kbd> तत्वों के लिए फ़ॉन्ट परिवार को परिभाषित करता है।	स्ट्रिंग या सूची	$ Font-family-monospace
36	$keystroke-color <Kbd> तत्वों के लिए पाठ रंग को परिभाषित करता है।	रंग	$ काला
37	$keystroke-background <Kbd> तत्वों के लिए पृष्ठभूमि रंग प्रदान करता है।	रंग	$ प्रकाश ग्रे
38	$keystroke-padding <Kbd> तत्वों के लिए पैडिंग निर्दिष्ट करता है।	संख्या या सूची	रेम-कैल्क (2 4 0)
39	$keystroke-radius <Kbd> तत्वों के लिए सीमा त्रिज्या प्रदर्शित करता है।	संख्या या सूची	$ वैश्विक-त्रिज्या
40	$abbr-underline <Abbr> तत्वों के लिए नीचे की सीमा शैली प्रदान करता है।	सूची	1px बिंदीदार $ काला