ब्लॉगर: तुमच्या ब्लॉगवरील कोडसाठी CSS शैली
एका मित्राने मला विचारले की मी ब्लॉगर एंट्रीमध्ये कोड क्षेत्र कसे बनवले. मी माझ्या ब्लॉगर टेम्पलेटमध्ये CSS साठी शैली टॅग वापरून हे केले. मी जोडले ते येथे आहे:
p.code {
font-family: Courier New;
font-size: 8pt;
border-style: inset;
border-width: 3px;
padding: 5px;
background-color: #FFFFFF;
line-height: 100%;
margin: 10px;
}
p.code
: हा एक CSS नियम आहे जो HTML ला लक्ष्य करतो<p>
वर्गाचे नाव "कोड" असलेले घटक. याचा अर्थ असा की या वर्गासह कोणताही परिच्छेद खालील गुणधर्मांनुसार शैलीबद्ध केला जाईल.font-family: Courier New;
: ही मालमत्ता फॉन्ट कुटुंबाला "कुरियर न्यू" वर सेट करते. हे लक्ष्यित घटकांमधील मजकूरासाठी वापरले जाणारे फॉन्ट निर्दिष्ट करते.font-size: 8pt;
: हे गुणधर्म फॉन्ट आकार 8 गुणांवर सेट करते. लक्ष्यित घटकांमधील मजकूर या फॉन्ट आकारात प्रदर्शित केला जाईल.border-style: inset;
: ही मालमत्ता सीमा शैली "इनसेट" वर सेट करते. हे लक्ष्यित घटकांभोवतीच्या सीमेसाठी बुडलेले किंवा दाबलेले स्वरूप तयार करते.border-width: 3px;
: हे गुणधर्म सीमा रुंदी 3 पिक्सेलवर सेट करते. घटकांभोवतीची सीमा 3 पिक्सेल जाडीची असेल.padding: 5px;
: हे गुणधर्म लक्ष्यित घटकांमधील सामग्रीभोवती 5 पिक्सेल पॅडिंग जोडते. हे मजकूर आणि बॉर्डरमधील अंतर प्रदान करते.background-color: #FFFFFF;
: हा गुणधर्म पार्श्वभूमीचा रंग पांढरा (#FFFFFF) वर सेट करतो. लक्ष्यित घटकांमधील सामग्रीला पांढरी पार्श्वभूमी असेल.line-height: 100%;
: हा गुणधर्म फॉन्ट आकाराच्या 100% रेषेची उंची सेट करतो. हे सुनिश्चित करते की मजकूर ओळी फॉन्ट आकारानुसार अंतर ठेवतात.margin: 10px;
: हा गुणधर्म संपूर्ण घटकाभोवती 10 पिक्सेलचा मार्जिन जोडतो. हे घटक आणि पृष्ठावरील इतर घटकांमधील अंतर प्रदान करते.
प्रदान केलेला CSS कोड "कोड" वर्गासह HTML परिच्छेदांसाठी शैली परिभाषित करतो. हे या परिच्छेदांसाठी फॉन्ट, फॉन्ट आकार, सीमा शैली, सीमा रुंदी, पॅडिंग, पार्श्वभूमी रंग, ओळीची उंची आणि मार्जिन सेट करते. ही शैली ब्लॉगर पोस्टमधील कोड स्निपेट्स किंवा प्रीफॉर्मेट केलेल्या मजकुरावर लागू केली जाऊ शकते आणि त्यांना विशिष्ट स्वरूप देण्यासाठी.
ते कसे दिसेल ते येथे आहे:
p.code {
फॉन्ट-फॅमिली: कुरियर नवीन;
फॉन्ट-आकार: 8pt;
सीमा-शैली: इनसेट;
सीमा-रुंदी: 3px;
पॅडिंगः एक्सएनयूएमएक्सपीएक्स;
पार्श्वभूमी-रंग: #FFFFFF;
ओळ-उंची: 100%;
समास: 10px;
}
शुभेच्छा कोडिंग!