वेबसाइटची व्हिज्युअल शैली आणि लेआउट सीएसएस किंवा कॅस्केडिंग स्टाइल शीट्स द्वारे निर्णायक असतात. हे असे दस्तऐवज आहेत जे एका वेबपृष्ठाच्या HTML मार्कअपला आकार देतात, वेब ब्राउझर प्रदान करते त्या निर्देशांवरून त्या मार्कअपवरील पृष्ठांवर कसे प्रदर्शित करावे यावरील सूचना. CSS पृष्ठाचे लेआउट तसेच रंग, पार्श्वभूमी प्रतिमा, टायपोग्राफी आणि बरेच काही हाताळते.
आपण सीएसएस फाइलकडे पहात असाल तर तुम्हाला दिसेल की कोणत्याही मार्कअप किंवा कोडींग भाषेप्रमाणेच या फाईल्सना त्यांचे विशिष्ट वाक्यरचना असते. प्रत्येक शैली पत्रक अनेक सीएसएस नियमांपासून तयार केले जातात. हे नियमावली जेव्हा पूर्ण भरली जाते तेव्हा त्या साइटवर कोणत्या शैली आहेत.
सीएसएस नियमांचे भाग
एक सीएसएस नियम दोन वेगळ्या भागांमधून बनतो - निवडकर्ता आणि घोषणा. निवडकर्त्याने ठरविले आहे की एका पृष्ठावर कसे टाइप केला आहे आणि घोषणेची शैली कशी असावी. उदाहरणार्थ:
पी {
रंग: # 000;
}
हा एक सीएसएस नियम आहे. निवडकर्ता भाग "पी" आहे, जो "अनुच्छेद" साठी एक घटक निवड आहे. म्हणूनच, साइटवरील सर्व परिच्छेद निवडा आणि त्यांना या शैलीसह प्रदान करा (जोपर्यंत परिच्छेद नसतील जे आपल्या सीएसएस कागदपत्रात अन्यत्र अधिक विशिष्ट शैलीद्वारे लक्ष्यित आहेत).
"रंग: 000;" म्हणत असलेल्या नियमाचा भाग घोषणे म्हणून काय म्हटले जाते ती घोषणा दोन तुकडे - मालमत्तेचे मूल्य आणि मूल्य.
मालमत्ता या घोषणेचा "रंग" तुकडा आहे. हे सूचित करते की, निवडकर्त्याचा कोणता दृष्टी दृष्टीक्षेप बदलेल.
मूल्य ही निवडलेली सीएसएस गुणधर्म त्यात बदलण्यात येतील. आमच्या उदाहरणामध्ये, आम्ही # 000 चे हेक्स मूल्य वापरत आहोत, जे "काळा" साठी CSS लघुलिपी आहे.
त्यामुळे या सीएसएस नियम वापरून, आमच्या पृष्ठात फॉन्ट-रंगाच्या काळ्या रंगात दाखवलेले परिच्छेद असतील.
सीएसएस मालमत्ता मूलभूत
जेव्हा आपण सीएसएस प्रॉपर्टीज लिहितो तेव्हा आपण ते योग्य दिसाल तेव्हाच आपण त्यांना अप बसवू शकणार नाही. उदाहरणे साठी, "रंग" एक वास्तविक सीएसएस गुणधर्म आहे, म्हणून आपण ते वापरू शकता हे गुणधर्म म्हणजे एखाद्या घटकाचा मजकूर रंग ठरविते. जर आपण CSS गुणधर्म प्रमाणे "मजकूर-रंग" किंवा "फॉन्ट-रंग" वापरण्याचा प्रयत्न केला, तर ते अयशस्वी होतील कारण ते सीएसएस भाषेचे वास्तविक भाग नाहीत.
दुसरे उदाहरण ठिकाण "पार्श्वभूमी-प्रतिमा" आहे. ही प्रॉपर्टी एक प्रतिमा सेट करते जे पार्श्वभूमीसाठी वापरले जाऊ शकते, जसे की:
.logo {
पार्श्वभूमी-प्रतिमा: url (/images/company-logo.png);
}
जर आपण "बॅकग्राउंड-पिक्चर" किंवा "बॅकग्राउंड-ग्राफीक" एक प्रॉपर्टी म्हणून वापरण्याचा प्रयत्न केला तर ते अपयशी होतील कारण पुन्हा एकदा हे मूळ CSS गुणधर्म नाहीत.
काही सीएसएस गुणधर्म
अनेक सीएसएस गुणधर्म आहेत जी तुम्ही साईट स्टाइल करण्यासाठी वापरू शकता. काही उदाहरणे आहेत:
- बॉर्डर (सीमा-शैली, सीमा-रंग आणि सीमा-रुंदीसह)
- पॅडिंग (पॅडिंग-टॉप, पॅडिंग-राइट, पॅडिंग-तळ आणि पॅडिंग-डावीकडे)
- मार्जिन (समास-शीर्ष, समास-उजवी, समास-तळ आणि समास-डावीकडे)
- फॉन्ट-कुटुंब
- अक्षराचा आकार
- पार्श्वभूमी-रंग
- रूंदी
- उंची
ही CSS गुणधर्म उदाहरणे म्हणून वापरण्यासाठी उत्तम आहेत, कारण ते सर्व अतिशय सरळ आहेत आणि जरी आपल्याला सीएसएस माहित नसेल तरीही आपण त्यांच्या नावांवर आधारित असलेल्या गोष्टींचा अंदाज लावू शकता.
इतर सीएसएस गुणधर्म आहेत जी आपणास मिळतील की जे त्यांच्या नावासोबत ते कसे कार्य करतात ते तितके स्पष्ट नाही.
- फ्लोट
- साफ करा
- ओव्हरफ्लो
- मजकूर-परिवर्तन
- Z- निर्देशांक
आपण वेब डिझाइनमध्ये सखोल जाताना आपल्याला या सर्व गुणधर्मांसह (आणि वापरण्यासाठी) अधिक मिळेल!
गुणधर्म मूल्यांची आवश्यकता आहे
आपण जेव्हा प्रत्येक प्रॉपर्टीचा वापर करता तेव्हा आपल्याला त्याला मूल्य द्यावे लागेल आणि विशिष्ट गुणधर्म फक्त काही मूल्ये स्वीकारू शकतात.
"रंग" प्रॉपर्टीच्या आमच्या पहिल्या उदाहरणामध्ये, आपल्याला रंग मूल्य वापरण्याची आवश्यकता आहे. हे हेक्स मूल्य , RGBA मूल्य किंवा अगदी रंग कीवर्ड देखील असू शकते. तथापि, यापैकी कोणतीही मूल्ये कार्य करतील, तथापि, आपण या मालमत्तेसह "खिन्न" शब्द वापरल्यास, ते काहीच करणार नाही कारण, त्या शब्दाप्रमाणेच वर्णनीय आहे, हे सीएसएस मध्ये ओळखलेले मूल्य नाही.
"बॅकग्राउंड-प्रतिमा" चे दुसरे उदाहरण म्हणजे आपल्या साइटच्या फायलींमधून वास्तविक प्रतिमा आणण्यासाठी प्रतिमा पथ वापरणे आवश्यक आहे हे मूल्य / सिंटॅक्स आवश्यक आहे.
सर्व सीएसएस गुणधर्मांकडे त्यांची अपेक्षा असणारी मूल्ये आहेत. उदाहरणार्थ:
- बॉर्डर-रंगासाठी रंग मूल्य अपेक्षित आहे
- बॉर्डर-आकार एक आकारमान मूल्य जसे पिक्सेल किंवा टक्केवारीची अपेक्षा करते
- बॉर्डर शैलींना या मालमत्तेसाठी वापरल्या जाणार्या आरक्षित शैलीपैकी एक "ठोस"
जर आपण सीएसएस गुणधर्मांच्या सूचीमधून भरत असाल, तर तुम्हाला हे दिसून येईल की त्यांच्यातील प्रत्येक विशिष्ट मूल्य आहेत ज्यासाठी ते वापरतात त्या शैली तयार करण्यासाठी वापरतात.
जेरेमी गिरर्ड द्वारा संपादित