आपण HTML सह वेबपृष्ठे तयार करणे सुरू करताच, आपण sizing सह कार्य करण्यास प्रारंभ कराल. आपली साइट आपण ज्याप्रकारे पाहु इच्छित आहात त्या पद्धतीने ते तयार करण्यासाठी, कदाचित आपण किंवा इतर डिझायनरने तयार केलेल्या डिझाइनसह जुळणी करणे, आपण त्या साइटवरील मजकूराचा आकार तसेच पृष्ठावरील इतर घटक बदलू इच्छित असाल. हे करण्यासाठी तुम्ही एचटीएमएल "आकार" टॅग शोधू शकाल, पण तुम्ही ते लगेच गहाळपणे शोधू शकाल.
HTML आकार टॅग HTML मध्ये अस्तित्वात नाही. त्याऐवजी, आपल्या फॉन्ट, प्रतिमा किंवा लेआउटचा आकार सेट करण्यासाठी आपण कॅस्केडिंग शैली पत्रक वापरणे आवश्यक आहे खरेतर, एखाद्या साइटच्या मजकूरास किंवा दुसर्या घटकामध्ये आवश्यक असलेल्या कोणत्याही व्हिज्युअल बदलास सीएसएसने हाताळले पाहिजेत! HTML केवळ रचनासाठी आहे
एचटीएमएल आकार टॅगचा सर्वात जवळचा टॅग हा जुना फॉन्ट टॅग आहे, ज्यामध्ये खरोखरच आकाराचे गुणविशेष समाविष्ट होते. चेतावणी द्या की हा टॅग HTML च्या वर्तमान आवृत्तीमध्ये नापसंत केलेला आहे आणि भविष्यात ब्राउझरद्वारे समर्थित नाही. आपण आपल्या HTML मध्ये फॉन्ट टॅग वापरण्याची इच्छा नाही! त्याऐवजी, आपण आपल्या HTML घटकांना आकार देण्यासाठी सीएसएस जाणून घ्यावे आणि त्यानुसार आपले वेबपृष्ठ शैलीबद्ध केले पाहिजे.
फॉन्ट आकार
फॉन्ट्स ठामपणे सीएसएस सह आकार सर्वात सोपा गोष्टी आहेत. Moreso फक्त त्या मजकूर आकार देणे पेक्षा, आपण आपल्या वेबसाइट टायपोग्राफी बद्दल अधिक विशिष्ट होऊ शकता सीएसएस सह. आपण फॉन्ट आकार, रंग, कॅसिंग, वजन, अग्रेसर, आणि अधिक परिभाषित करू शकता. फॉन्ट टॅगसह, आपण केवळ आकार परिभाषित करू शकता, आणि नंतर केवळ प्रत्येक ग्राहकासाठी भिन्न असलेल्या ब्राउझरच्या डीफॉल्ट फॉन्ट आकारापेक्षा एक संख्या म्हणून.
आपला परिच्छेद 12pt चा आकार बदलण्यासाठी फॉन्ट-आकार शैली गुणधर्म वापरा:
h3 {font-size = 24px; }हे शैली हेडिंगिंग 3 घटकांचे 24 पिक्सेल फॉन्ट आकार सेट करेल. आपण हे एका बाह्य शैली पत्रकात जोडू शकता आणि आपल्या साइटच्या सर्व H3s या शैलीचा वापर करतील
आपण आपल्या मजकूरमध्ये अतिरिक्त टायपोग्राफी शैली जोडू इच्छित असल्यास, आपण त्यांना या CSS नियम वर जोडू शकता:
h3 {font-size: 24px; रंग: # 000; फॉन्ट वजन: सामान्य; }हे केवळ H3s साठी ते फॉन्ट आकार सेट करणार नाही, ते रंग काळजाळ (जे हेक्स कोड # 000 अर्थ आहे) वर देखील सेट करेल आणि हे "सामान्य" वर वजन सेट करेल डीफॉल्टनुसार, ब्राउझर हेडिंग 1-6 बोल्ड टेक्स्ट म्हणून प्रदान करते, त्यामुळे ही शैली त्या डीफॉल्ट आणि "अन-बोल्ड" मजकूरास अधिलिखित करेल.
प्रतिमा आकार
आकार स्पष्ट करण्यासाठी प्रतिमा अवघड असू शकतात कारण आपण प्रतिमाचा आकार बदलण्यासाठी ब्राउझरचा उपयोग करु शकता. नक्कीच, ब्राऊझरच्या प्रतिमेचे आकार बदलणे ही एक वाईट कल्पना आहे कारण हे पृष्ठे अधिक हळूहळू लोड करतात आणि बर्याचदा बर्याचदा प्रतिमा बदलणे अशक्य होते कारण प्रतिमा खराब दिसतात. त्याऐवजी, आपण प्रतिमेचा आकार बदलण्यासाठी ग्राफिक्स सॉफ्टवेअर वापरणे आणि नंतर आपल्या वेब पृष्ठ HTML मध्ये त्यांची वास्तविक आकार लिहा.
फॉन्टच्या विपरीत, आकार परिभाषित करण्यासाठी प्रतिमा एचटीएमएल किंवा सीएसएस वापरू शकते. आपण प्रतिमाची रुंदी आणि उंची निश्चित करता जेव्हा आपण एचटीएमएल वापरता तेव्हा तुम्ही केवळ पिक्सेलमध्ये इमेज चा आकार परिभाषित करू शकता. जर आपण सीएसएस वापरत असाल तर आपण इंच, सेंटीमीटर आणि टक्केवारीसह इतर मापन वापरू शकता. हे शेवटचे मूल्य, टक्केवारी, जेव्हा आपल्या प्रतिमांना एका संवेदनशील वेबसाइटप्रमाणेच द्रव असणे आवश्यक आहे तेव्हा खूप उपयुक्त आहे.
एचटीएमएल वापरुन तुमचा इमेज साइज़ निश्चित करण्यासाठी, आयएमजी टॅगची उंची आणि रुंदीची अट वापरा. उदाहरणार्थ, ही प्रतिमा 400x400 पिक्सेल स्क्वेअर असेल.
उंची = "400" रुंदी = "400" alt = "image" />CSS वापरून आपल्या प्रतिमा आकार परिभाषित करण्यासाठी, उंची आणि रुंदी शैली गुणधर्म वापरा. आकार परिभाषित करण्यासाठी CSS वापरून, येथे समान प्रतिमा आहे:
शैली = "उंची: 400 पीएक्स; रूंदी: 400 पीएक्स;" alt = "image" />लेआउट आकार
आपण मांडणीत परिभाषित केलेले सर्वात सामान्य आकार रुंदी आहे आणि आपल्याला ठरविण्याची आवश्यकता असलेली पहिली गोष्ट म्हणजे एक निश्चित रूंदीची मांडणी किंवा एक प्रतिसाद वेबसाइट वापरणे आहे. दुसऱ्या शब्दांत, आपण रुंदी पिक्सेल, इंच किंवा अंकांच्या अचूक संख्या म्हणून परिभाषित करणार आहात? किंवा आपण आपली लेआउट रूंदी ईएमएस किंवा टक्केवारी वापरून लवचिक असणे सेट करणार आहात? आपल्या लेआऊटचा आकार परिभाषित करण्यासाठी, आपण रूंदी आणि उंची CSS गुणधर्म वापरत आहात जसे की आपण एखाद्या प्रतिमेत.
मुदत रूंदी:
शैली = "रूंदी: 600px;">लिक्विड रूंदी:
शैली = "रुंदी: 80%;">जेव्हा आपण आपल्या लेआऊटसाठी रूंदीवर निर्णय घेता, तेव्हा आपण आपल्या वाचकांसाठी वापरत असलेली भिन्न ब्राउझरची रूंदी लक्षात ठेवू शकता आणि भिन्न डिव्हाइसेस देखील ते वापरत आहेत. यामुळे प्रतिसाद वेबसाइट्स , जे त्यांचे लेआउट बदलू शकतात आणि वेगवेगळ्या डिव्हाइसेस आणि स्क्रीन आकारांच्या आधारे आकार बदलू शकतात, आजच सर्वोत्तम अभ्यास मानक आहेत