एचटीएमएलमध्ये सुंदर फॉन्ट कसा बनवायचा: आकार, रंग, एचटीएमएल फॉन्ट टॅग. फॉन्ट टॅगच्या HTML विशेषतांमध्ये फॉन्ट कंट्रोल टॅग
असे दिसते की मजकूरासाठी HTML टॅग का माहित आहेत, जर आता जवळजवळ कोणत्याही ॲडमिन पॅनेलमध्ये सोयीस्कर असेल जे ते स्वयंचलितपणे सेट करते?
वस्तुस्थिती अशी आहे की वेबसाइटवरील सामग्रीचे स्वरूपन हे कार्यालयीन अनुप्रयोगांमध्ये काम करण्यापेक्षा मूलभूतपणे भिन्न आहे. येथे केवळ मजकूराला एक आकर्षक स्वरूप देणे पुरेसे नाही, कारण केवळ वेब पृष्ठाचे प्रदर्शनच नाही तर शोध इंजिनमध्ये त्याची जाहिरात देखील योग्य डिझाइनवर अवलंबून असते.
HTML टॅग आणि विशेषता: मूलभूत वाक्यरचना
कोणताही मजकूर आहे लपलेला कोड, जे संगणकाला स्क्रीनवर काय आणि कसे प्रदर्शित करायचे ते "स्पष्ट करते". सर्व माहिती सार्वत्रिक घटकांचा संच वापरून रेकॉर्ड केली जाते.
मूलत:, HTML मजकूर टॅग हे आदेश आहेत जे पृष्ठावर विशिष्ट ब्लॉक जोडतात किंवा बदलतात. देखावा. अचूक रेकॉर्डिंग स्वरूप असे दिसते:
कृपया लक्षात घ्या की सर्व टॅग जोडलेले नाहीत. उदाहरणार्थ,
(लाइन वगळा) किंवा
(या व्यतिरिक्त क्षैतिज रेखा) अजिबात बंद करणे आवश्यक नाही.
तुम्ही वर्ड आणि इतर प्रोग्राममधील लेख वेबसाइट एडिटरमध्ये का कॉपी करू शकत नाही
जरी आधुनिक ऑफिस प्रोग्राम मजकूरासाठी समान HTML टॅग वापरत असले तरी, 99% वेळा मूळ कोड वेब पृष्ठांसाठी निरुपयोगी असतो. जरी दस्तऐवज सामान्यपणे ऍप्लिकेशनमध्येच प्रदर्शित केला असला तरीही, वेबसाइटवर टाकल्यावर, स्वरूपन गमावले जाऊ शकते. याव्यतिरिक्त, मोठ्या संख्येने अनावश्यक टॅग आणि विशेषतांमुळे, शोध इंजिने पृष्ठाच्या सामग्रीचे पुरेसे विश्लेषण करू शकत नाहीत. जे, यामधून, आपल्या संसाधनाचा प्रचार करणे कठीण करते.
स्वच्छ आणि संबंधित कोड मिळविण्यासाठी, तुम्हाला प्रथम नियमित संपादकाने तयार केलेल्या HTML टॅगचा मजकूर साफ करणे आवश्यक आहे. हे करण्याचे अनेक मार्ग आहेत:
- नोटपॅडद्वारे लेख “चालवा” आणि त्यानंतरच तो साइटवर घाला. अनुप्रयोग सर्व एचटीएमएल मिटवतो, म्हणून त्यानंतर तुम्हाला मजकूर पुन्हा स्वरूपित करावा लागेल (संपादक साधने किंवा व्यक्तिचलितपणे).
- LiveWriter वापरून लेख लिहा आणि प्रकाशित करा. लोकप्रिय ब्लॉग संपादक लगेच व्युत्पन्न करतो योग्य कोड. आणि मध्ये स्वतंत्र टॅबसाइटवर मजकूर कसा दिसेल ते तुम्ही पाहू शकता.
- HTML क्लीनर वापरा. ही ऑनलाइन सेवा संपूर्ण कोड नष्ट करत नाही, परंतु केवळ अनावश्यक तुकडे. फिल्टर वापरून, तुम्ही कोणते टॅग सेव्ह करायचे ते तुम्ही निवडता. एक शक्तिशाली व्हिज्युअल फॉरमॅटिंग एडिटर देखील आहे जो कोडमध्ये आधीच ऑप्टिमाइझ केलेल्या कमांड्स जोडतो.
परिच्छेद
हा घटक जवळपास सर्वच लेखांमध्ये असतो. प्रत्येक परिच्छेद अशा कंटेनरमध्ये स्थित असावा - हे स्वरूपन सुलभ करते आणि आपल्याला साइटच्या सर्व पृष्ठांवर एक सुसंगत शैली राखण्यास अनुमती देते. सोयीसाठी, टॅग
नेहमी नवीन ओळीवर लिहा.
संरेखन
"टेक्स्ट अलाइनमेंट" हा स्वतंत्र HTML टॅग बराच काळ वापरला गेला नाही. त्याऐवजी, एक सामान्य ALIGN विशेषता तयार केली गेली. पृष्ठावरील मजकूर ब्लॉकची स्थिती बदलण्यासाठी, आपण 3 मूल्यांपैकी एक निवडणे आवश्यक आहे - केंद्र, उजवीकडे किंवा डावीकडे. तुम्ही इतर घटकांसाठी संरेखन सेट करू शकता, जसे की हेडिंग, त्याच प्रकारे.
काही परिस्थितींमध्ये, इतर टॅग संरेखनासाठी वापरले जातात, उदाहरणार्थ, तुम्ही घटक वापरून स्थान देऊ शकता
मथळे आणि उपशीर्षके
उपशीर्षक प्रणाली तुम्हाला तार्किक सामग्री रचना तयार करण्यास अनुमती देते. जेव्हा मजकूर अर्थपूर्ण ब्लॉकमध्ये विभागला जातो, तेव्हा वाचकाला नवीन माहिती एकाग्र करणे आणि आत्मसात करणे खूप सोपे होते. पृष्ठाचा प्रचार कोणत्या क्वेरीसाठी करावा हे समजून घेण्यासाठी शोध इंजिन देखील मथळ्यांचे विश्लेषण करतात. म्हणूनच एसईओ तज्ञ त्यांच्यामध्ये सामयिक कीवर्ड वापरण्याची शिफारस करतात.
HTML उपशीर्षकांच्या सहा स्तरांचा वापर करते - पासून
आधी . या प्रणालीमध्ये एक स्पष्ट पदानुक्रम आहे:...
. मुख्य लेख, ऑनलाइन स्टोअरमधील उत्पादन इ.). मजकुरात एकच असू शकतो . नियमानुसार, त्यात मुख्य कीवर्ड आहे.
...
. द्वितीय-स्तरीय उपशीर्षक मजकूर अर्थपूर्ण ब्लॉक्समध्ये मोडतात. उदाहरणार्थ, जर तुम्ही लॅपटॉपला रेटिंग देत असाल, तर तुम्ही अनेक करू शकता वेगवेगळ्या मॉडेल्सच्या नावांसह.
...
. मजकूर दोन दरम्यान असल्यास तिसरा स्तर आवश्यक आहे लहान ब्लॉक्समध्ये देखील विभागले आहे. आमच्या उदाहरणात, हे मूल्यमापन निकष असू शकतात - प्रत्येक मॉडेलसाठी “कार्यप्रदर्शन”, “मेमरी”, “व्हिडिओ कार्ड” इ.
, ,
. सराव मध्ये ते अत्यंत दुर्मिळ आहेत. परंतु सामान्य तत्त्व समान आहे - ते शीर्ष-स्तरीय उपशीर्षक असलेल्या ब्लॉकमध्ये "नेस्टेड" असले पाहिजेत.
...
. मुख्य लेख, ऑनलाइन स्टोअरमधील उत्पादन इ.). मजकुरात एकच असू शकतो. नियमानुसार, त्यात मुख्य कीवर्ड आहे.
...
. द्वितीय-स्तरीय उपशीर्षक मजकूर अर्थपूर्ण ब्लॉक्समध्ये मोडतात. उदाहरणार्थ, जर तुम्ही लॅपटॉपला रेटिंग देत असाल, तर तुम्ही अनेक करू शकतावेगवेगळ्या मॉडेल्सच्या नावांसह.
...
. मजकूर दोन दरम्यान असल्यास तिसरा स्तर आवश्यक आहेलहान ब्लॉक्समध्ये देखील विभागले आहे. आमच्या उदाहरणात, हे मूल्यमापन निकष असू शकतात - प्रत्येक मॉडेलसाठी “कार्यप्रदर्शन”, “मेमरी”, “व्हिडिओ कार्ड” इ.
,
. सराव मध्ये ते अत्यंत दुर्मिळ आहेत. परंतु सामान्य तत्त्व समान आहे - ते शीर्ष-स्तरीय उपशीर्षक असलेल्या ब्लॉकमध्ये "नेस्टेड" असले पाहिजेत.,
योग्य पदानुक्रम राखण्याची खात्री करा. आमच्या उदाहरणाकडे परत आल्यावर, याचा अर्थ असा आहे की तुम्ही मॉडेलची नावे त्वरित म्हणून प्रविष्ट करू शकत नाही
किंवा . आणि त्याहीपेक्षा, एकसंध अर्थाच्या ब्लॉक्ससाठी वेगवेगळ्या स्तरांचे उपशीर्षक वापरा (उदाहरणार्थ, रँकिंगमध्ये शेवटचे स्थान घेतलेला लॅपटॉप हायलाइट करा ).
).
येथे एक आकृती आहे जी तुम्हाला HTML मधील शीर्षलेखांची योग्य रचना त्वरित समजून घेण्यास आणि लक्षात ठेवण्यास मदत करेल.
याद्या
मजकूरासाठी ( ठराविक चूक- फक्त काही परिच्छेद
जे हायफन किंवा संख्येने सुरू होते).
अशा ब्लॉक्सची रचना अगदी सोपी आहे. प्रथम, आम्ही सूचीचा प्रकार निर्धारित करतो - बुलेट केलेले किंवा क्रमांकित.
सर्व घटक ओपनिंग आणि क्लोजिंग टॅग दरम्यान आहेत. प्रत्येक सूची आयटम नवीन ओळीवर सुरू होतो आणि त्याचे स्वरूप आहे. घटकांची संख्या मर्यादित नाही.
निवड आणि त्याचे गुणधर्म
हा फॉन्ट आणि रंग वापरून काय बदलले जाऊ शकते - आणि CSS मध्ये नवीन वर्ग न जोडता. जेव्हा तुम्हाला फक्त एक वाक्य किंवा तुकडा हायलाइट करण्याची आवश्यकता असते तेव्हा हे अतिशय सोयीचे असते.
अनेक गुणधर्म आहेत:
- चेहरा. तुम्हाला मजकूर फॉन्ट बदलण्याची परवानगी देते. तुम्ही स्वल्पविरामाने विभक्त केलेले अनेक पर्याय सूचीबद्ध करू शकता (ताहोमा, वर्डाना). जर वापरकर्त्याने पहिला फॉन्ट स्थापित केला नसेल तर, सिस्टम फक्त एक पर्याय वापरते.
- आकार. मजकूर मोठा किंवा लहान करण्यासाठी, अवतरण चिन्हांमध्ये 1 आणि 7 मधील मूल्य प्रविष्ट करा.
- रंग. डिझाइनच्या आधारावर, तुम्ही मानक शेड्सपैकी एक निवडू शकता (लाल, हिरवा, निळा) किंवा तुमच्या आवडीच्या कोणत्याही रंगासाठी कोड प्रविष्ट करू शकता.
सह फॉरमॅट केलेले परिच्छेद वापरू नका , उपशीर्षकाऐवजी. योग्य टॅगसह समान डिझाइन पॅरामीटर्स सेट करणे चांगले आहे.
मजकूर हायलाइट करण्याचे मार्ग
नीरस मजकूर थकवणारा आहे, अगदी परिच्छेदांमध्ये मोडला गेला आहे. लक्ष वेधण्यासाठी आणि वाचकाची आवड निर्माण करण्यासाठी, मुख्य मुद्दे ग्राफिक पद्धतीने हायलाइट करण्याची शिफारस केली जाते. येथे काही आदेश आहेत जे आपल्याला या कार्याचा सामना करण्यास मदत करतील.
... . एक अत्यंत लोकप्रिय HTML टॅग. लघुप्रतिमाताबडतोब डोळा पकडतो, आणि म्हणूनच त्याच्या मदतीने महत्त्वपूर्ण शोध आणि तथ्ये हायलाइट करणे सोयीचे आहे.
बरेच लोक टॅग गोंधळात टाकतात आणि . व्हिज्युअल फरक नाही, परंतु ते वेगळ्या पद्धतीने कार्य करतात. पहिला मजकूराचे स्वरूप बदलतो, तर दुसरा "इंडेक्स" म्हणून कार्य करतो आणि सर्वात महत्वाचे तुकडे (एसईओसाठी थीमॅटिक कीवर्ड आणि वाक्यांश) हायलाइट करतो.
... . वैज्ञानिक संज्ञा, परदेशी शब्द आणि विविध कोट्सच्या डिझाइनसाठी मोहक आणि कठोर तिर्यक आदर्श आहे. गंभीर प्रकाशनांमध्ये, कलाकृतींची नावे देखील तिर्यक मजकुरात हायलाइट केली जातात.
... . कदाचित इतर कोणत्याही HTML टॅगमुळे इतका वाद झाला नसेल. अधोरेखित मजकूर क्वचितच वापरला जातो कारण ही पद्धतहायलाइट्स ऐतिहासिकदृष्ट्या हायपरलिंकला नियुक्त केले गेले आहेत. आपण वापरत असल्यास लेखांमध्ये, कृपया लक्षात घ्या की हे फक्त लहान तुकड्यांसाठी योग्य आहे - 1 पेक्षा जास्त ओळ नाही.
...
. एक मनोरंजक टॅग जो तुम्हाला जाहिरातींमध्ये खूप समर्पक भाग बनवण्याची परवानगी देतो - उदाहरणार्थ, जुन्या आणि नवीन किंमतींमधील कॉन्ट्रास्टवर जोर देण्यासाठी.
... . कोणत्याही अतिरिक्त पर्यायांशिवाय फॉन्ट आकार वाढवण्याचा सर्वात सोपा मार्ग.
... . हे मागील टॅग प्रमाणेच तत्त्वावर कार्य करते. आत असलेला मजकूर मुख्य मजकूराच्या तुलनेत कमी केला आहे.
... . या फॉरमॅटचे योग्य नाव सुपरस्क्रिप्ट आहे. हा टॅग प्रामुख्याने गणितीय अंश आणि तळटीपांसाठी आहे. हे फॉन्ट आकार कमी करते आणि निवडलेला मजकूर वर हलवते.
... . सबस्क्रिप्ट अनेकदा विविध सूत्रांमध्ये आढळतात. निवडलेला तुकडा मुख्य मजकुराच्या खाली स्थित आहे.
अर्थपूर्ण कंटेनर
अनेक मजकुरात काही ब्लॉक्स सापडल्याने त्यांच्यासाठी खास टॅग तयार केले जाऊ लागले. हे स्वरूपन सुलभ करते, कारण प्रत्येक प्रकारच्या सामग्रीची स्वतःची शैली असल्यास, तुम्हाला फक्त मजकूराचा एक भाग हायलाइट करणे आणि त्यात कोणती माहिती आहे हे सूचित करणे आवश्यक आहे.
...
. संगणक कोड जोडण्यासाठी टॅग करा. उदाहरणांसह प्रोग्रामिंगवरील लेखांमध्ये अपरिहार्य - आदेश कार्यान्वित केले जात नाहीत, परंतु साधा मजकूर म्हणून प्रदर्शित केले जातात.
... . कोट्सचे स्वरूपन करण्यासाठी डिझाइन केलेले - उदाहरणार्थ, मुलाखतीचे प्रमुख उतारे.
. मजकूराचा भाग वेगळ्या ब्लॉकमध्ये ठेवतो. डीफॉल्टनुसार, निवडीमध्ये अधिक डावे पॅडिंग असते, परंतु तुम्ही CSS मधील मजकूराचा आकार, फॉन्ट शैली आणि रंग देखील बदलू शकता.
... . एक अतिरिक्त टॅग ज्यामध्ये दुव्यांसह लेखकाबद्दल माहिती आहे.
सीमांकन रेषा
मोठ्या विभागाचा तार्किक शेवट चिन्हांकित करण्यासाठी एक साधी ओळ वापरली जाऊ शकते.
जोडलेल्या टॅगवर लागू होत नाही. याचा अर्थ असा की क्लोजिंग फॉरमॅट घटकगरज नाही.
WIDTH विशेषता वापरून, तुम्ही पिक्सेलमध्ये योग्य आकार किंवा विंडो रुंदीची टक्केवारी निर्दिष्ट करून विभाजक लहान करू शकता.
HTML मध्ये मजकूर फॉरमॅट करण्यासाठी टॅगचा योग्य प्रकारे वापर कसा करायचा हे शिकून, तुम्ही तुमच्या लेखांना वाचण्यास सोपे बनवणार नाही तर तुमची SEO परिणामकारकता देखील वाढवू शकाल.
टॅग करा आकार, रंग आणि टाइपफेस यासारख्या फॉन्ट वैशिष्ट्ये बदलण्यासाठी एक कंटेनर आहे. हा टॅग अद्याप सर्व ब्राउझरद्वारे समर्थित असला तरी, तो अप्रचलित मानला जातो आणि शैलींच्या बाजूने त्याचा वापर सोडून देण्याची शिफारस केली जाते.
मांडणी
मजकूरपर्याय
टॅग पॅरामीटर्सचे वर्णन
COLOR पॅरामीटर
कंटेनरमध्ये मजकूराचा रंग सेट करतो .
मांडणी
...CSS -color चे ॲनालॉग
FACE पॅरामीटर
मजकूरासाठी वापरलेला फॉन्ट टाइपफेस निर्दिष्ट करण्यासाठी फेस पॅरामीटर वापरला जातो. तुम्ही स्वल्पविरामाने विभक्त केलेल्या अनेक फॉन्ट नावांची यादी करू शकता. या प्रकरणात, जर पहिला निर्दिष्ट फॉन्ट सापडला नाही, तर ब्राउझर सूचीतील पुढील फॉन्ट वापरेल.
मांडणी
...आर्ग्युमेंट्स म्हणजे स्वल्पविरामाने विभक्त केलेल्या फॉन्ट नावांची संख्या. सार्वत्रिक फॉन्ट कुटुंबे:
- सेरिफ— सेरिफ फॉन्ट (प्राचीन), जसे की टाइम्स;
- sans-serif— sans-serif फॉन्ट (सेरिफ किंवा sans serifs शिवाय फॉन्ट), एक विशिष्ट प्रतिनिधी Arial आहे;
- अभिशाप- इटालिक फॉन्ट;
- कल्पनारम्य- सजावटीचे फॉन्ट;
- मोनोस्पेस- मोनोस्पेस फॉन्ट, या कुटुंबातील प्रत्येक वर्णाची रुंदी समान आहे.
CSS ॲनालॉग - फॉन्ट-फॅमिली
SIZE पॅरामीटर
1 ते 7 पर्यंत अनियंत्रित एककांमध्ये फॉन्ट आकार सेट करते. डीफॉल्टनुसार वापरलेला सरासरी आकार 3 आहे. फॉन्ट आकार एकतर निरपेक्ष मूल्य (उदाहरणार्थ, size="4") किंवा संबंधित मूल्य म्हणून निर्दिष्ट केला जाऊ शकतो (यासाठी उदाहरणार्थ, size="+1" size="-1"). नंतरच्या प्रकरणात, आकार बेसच्या तुलनेत बदलतो. फॉन्ट आकार केवळ निर्दिष्ट आकाराच्या पॅरामीटरनेच नव्हे तर फॉन्ट टाइपफेसच्या निवडीद्वारे देखील प्रभावित होतो. तर, एरियल फॉन्ट पेक्षा मोठा दिसतो वेळा फॉन्ट, आणि Verdana फॉन्ट एरियल फॉन्टपेक्षा थोडा मोठा आहे. फॉन्ट आणि त्याचा आकार निवडताना हे वैशिष्ट्य लक्षात घ्या.
मांडणी
...युक्तिवाद हा 1 ते 7 पर्यंतचा पूर्णांक आहे किंवा + आणि - चिन्हे वापरून मूल्यात वाढ किंवा घट आहे.
आज आपण फॉन्ट, ब्लॉककोट, प्री, स्ट्राँग, एम, बी, आय आणि इतर अशा विविध टॅग्जचा विचार करत राहू, जे टेक्स्ट फॉरमॅटिंगला परवानगी देतात.
ब्लॉककोट आणि प्री - एचटीएमएल फॉरमॅटिंग
पूर्वी (सीएसएसच्या आगमनापूर्वीही) कोट टॅग ब्लॉककोटव्ही HTML कोडबऱ्याचदा वापरला गेला कारण त्यात बंद केलेल्या मजकुराच्या तुकड्याला क्षैतिज इंडेंटेशन प्राप्त झाले, जे वापरण्याच्या अशक्यतेमुळे त्या वेळी करणे इतके सोपे नव्हते. CSS गुणधर्म. ब्लॉककोट घटक जोडलेला आहे आणि त्यात इनलाइन आणि ब्लॉक टॅग दोन्ही असू शकतात (उदाहरणार्थ, P परिच्छेद).
उदाहरण
ब्लॉककोटमध्ये जोडलेले उदाहरण
आजकाल मजकूर फॉरमॅट करताना ब्लॉककोट टॅग वापरला जातो, परंतु आमच्या काळातील कोट्सचे स्वरूप सहसा यासह सेट केले जाते CSS वापरूनतुमच्या डिझाइन टेम्प्लेटच्या स्टाईल शीटसह फाइलमध्ये विशेषत: त्यासाठी निर्दिष्ट केलेले गुणधर्म. उदाहरणार्थ, माझ्या ब्लॉगच्या बाबतीत, style.css मध्ये तुम्हाला खालील ओळी सापडतील:
#content blockquote(margin:15px 0 20px 0;padding:5px 8px 5px 35px;पार्श्वभूमी:#eaedf0 url(images/quote2.png) नाही-पुनरावृत्ती डाव्या शीर्षस्थानी;पार्श्वभूमी-स्थिती:8px 5px;font;66;color:-6 size:14px;width:91%;font-style:italic;) #content blockquote p(color:#666;font-size:14px;)
बरं, मॅनेजरच्या मुलाखतीसह लेखाच्या मजकुरात ब्लॉककोटमध्ये समाविष्ट केलेले कोट्स कसे दिसतील ते तुम्ही पाहू शकता.
Html मधील कोट व्यतिरिक्त (CSS च्या आगमनापूर्वी), दुसरा फॉरमॅटिंग टॅग मोठ्या प्रमाणात वापरला जात होता - केंद्र. हे जोडलेले आहे (एक प्रकारचा कंटेनर) आणि ब्लॉक. यात कोणतेही मजकूर घटक असू शकतात (दोन्ही रेषा आणि ब्लॉक), जे या क्रियेच्या परिणामी मध्यभागी संरेखित केले जातील.
तर, आता टॅग पाहू पूर्व, जे तुम्हाला थेट नमूद केलेले मजकूर स्वरूपन हस्तांतरित करण्याची परवानगी देते मूळ सांकेतिक शब्दकोश. लक्षात ठेवा की ब्राउझरमध्ये कोड पार्स करताना सर्व सलग (स्पेस, टॅब आणि लाइन ब्रेक) एकाच स्पेसने बदलले जातील.
तर, घटक प्री व्हाइटस्पेस वर्ण लहान करणे अक्षम करतेमजकूराच्या विभागात जो त्यात संलग्न केला जाईल. लक्षात घेण्याजोगा गोष्ट म्हणजे प्रीमध्ये बंद केलेल्या तुकड्यासाठी, ब्राउझर व्हाईटस्पेस वर्ण वापरून आपोआप ओळी तोडणार नाही.
त्या. प्री एलिमेंटमधील सर्व ओळी ब्राउझरद्वारे सतत मानल्या जातील - तुम्ही कोडमध्ये लिहिल्याप्रमाणे, ते ब्राउझरमध्ये अशा प्रकारे प्रदर्शित केले जाईल. शिवाय, ब्राउझरमध्ये, प्री टॅग वापरून फॉरमॅट केलेला मजकूराचा विभाग प्रदर्शित करण्यासाठी, एक मोनोस्पेस फॉन्ट, जसे की कुरियर न्यू किंवा तत्सम, वापरला जाईल.
सोर्स कोड टॅगमध्ये फॉरमॅटिंग प्री टॅग जुने झाले आहेत
प्री टॅग स्वतःच ब्लॉक-लेव्हल आहे, आणि त्याच्या आत (हा टॅग जोडलेला आहे) फक्त इनलाइन सामग्री असू शकते (म्हणजे, परिच्छेद P, शीर्षलेख H1 - H6, इ. त्यामध्ये ठेवू नये).
एचटीएमएलमध्ये आणखी एक ब्लॉक टॅग आहे जो मजकूर स्वरूपनासाठी डिझाइन केलेला आहे - पत्ता. व्हॅलिडेटर मानकांनुसार, या टॅगमध्ये फक्त इनलाइन सामग्री असू शकते, जी ब्राउझरमध्ये तिर्यकांमध्ये प्रदर्शित केली जाईल.
फॉन्ट - शुद्ध एचटीएमएलमध्ये मजकूर रंग आणि फॉन्टसह कार्य करणे
मजकूर, एम - मजकूरातील तार्किक आणि व्हिज्युअल हायलाइटिंगसाठी टॅग
जर CSS आता अस्तित्वात नसेल, तर मला विशिष्ट तार्किक आणि भौतिक (दृश्य) मजकूर स्वरूपन टॅग्जच्या उद्देशाचे वर्णन करावे लागेल. पण, कारण CSS आता बऱ्याच साइट्सवर आधीच वापरला गेला आहे, Html कोडमधील अशा टॅगची भूमिका आधीपासूनच शून्यावर आली आहे, म्हणून मी त्वरीत त्यांच्याकडे जाईन आणि ते आधी का वापरले होते ते स्पष्ट करेन (आणि काही आता वापरल्या जात आहेत. ).
व्हिज्युअल टॅग मजकूराची शैली बदलण्यासाठी डिझाइन केले आहेत जे तुमच्या साइटवरील अभ्यागतांना दृश्यमान असतील, परंतु कोणत्या शोध इंजिनांनी विशेष लक्ष देऊ नये.
तार्किक मजकूर स्वरूपन टॅग, सिद्धांतानुसार, कोणतेही सूचित करण्यासाठी ओरिएंट केलेले आहेत शोध इंजिनांसाठी उच्चार. वापरकर्त्यासाठी, या घटकांसह हायलाइट केल्याने हायलाइट केलेल्या शब्दांचे स्वरूप देखील बदलेल.
तुम्हाला आठवत असेल, तर फार पूर्वी नाही, ऑप्टिमायझर्सना सशक्त आणि EM लॉजिकल फॉरमॅटिंग टॅगसह कीवर्डसह (जसे ते हायलाइट केले जावेत) महत्त्वाची ठिकाणे हायलाइट करण्याचा सल्ला देण्यात आला होता, जे वापरकर्त्याला नेहमीच्या ठळक आणि तिर्यकांसारखे दिसतील.
पण त्याशिवाय निवडीसाठी कीवर्डवापरण्याचा सल्ला दिला HTML घटक“B” आणि “I”, जे वापरकर्त्यांसाठी पुन्हा ठळक आणि तिर्यक दिसतील, परंतु शोध इंजिनांद्वारे विचारात घेतले गेले नाहीत, कारण ते लॉजिकल फॉरमॅटिंग टॅग नाहीत.
आता हे सर्व व्यावहारिकदृष्ट्या यापुढे उद्दिष्टानुसार कार्य करत नाही आणि आम्ही शोध इंजिन्सकडून निश्चित लाभांशाची अपेक्षा न करता, सशक्त आणि EM वापरून कीवर्डची निवड अधिक सवयीबाहेर करतो.
तर, आधीच नमूद केलेल्या “B” आणि “I” व्यतिरिक्त (ठळक आणि तिर्यकांमध्ये) श्रेणीमध्ये व्हिज्युअल स्वरूपनयामध्ये फॉन्ट, प्री, लेखाच्या सुरुवातीला आधीच चर्चा केलेले, तसेच टॅग समाविष्ट आहेत:
- "यू" - अधोरेखित
- "स्ट्राइक" - ओलांडणे
- "सुप" - सुपरस्क्रिप्ट
- "सब" - सबस्क्रिप्ट
- "Tt" - मोनोस्पेस फॉन्ट
- "मोठा" - फॉन्ट वाढवा
- "लहान" - फॉन्ट कमी करा
बरं, आता घटकांची यादी पाहू तार्किक स्वरूपनमजकूर:
- "Em" - इटॅलिकमधील महत्त्वाच्या तुकड्यांचे तार्किक हायलाइटिंग
- "मजबूत" समान आहे, परंतु ते फक्त ठळकपणे उभे राहील
- "उद्धृत करा" - कोट्स इटालिक करा
- "कोड" - मोनोस्पेस फॉन्टसह विविध कोड प्रदर्शित करण्यासाठी डिझाइन केलेले
- "सॅम्प" - मोनोस्पेस फॉन्टसह अनेक वर्ण हायलाइट करण्यासाठी
- “Abbr” - या टॅगच्या शीर्षक विशेषतामध्ये संक्षेपाचे डीकोडिंग असते (जसे की CSS किंवा Html, जे अक्षरांद्वारे वाचले जातात, आणि एक शब्द म्हणून नाही). जेव्हा तुम्ही या संक्षेपावर माउस कर्सर हलवाल तेव्हा शीर्षकामध्ये लिहिलेले शब्द पॉप अप होतील.
- "संक्षेप" ही एकच गोष्ट आहे, परंतु परिवर्णी शब्दांसाठी वापरली जाते, म्हणजे. संक्षेप जे अक्षरांद्वारे वाचले जात नाहीत, परंतु शब्द म्हणून (उदाहरणार्थ, MKAD किंवा Gai)
- "Kbd" - मोनोस्पेस फॉन्टमध्ये कीबोर्डवरून साइट वापरकर्त्याने प्रविष्ट केलेला मजकूर प्रदर्शित करण्यासाठी वापरला जातो
- "Var" - काही कोडमधील व्हेरिएबल्स इटालिक करण्यासाठी वापरला जातो
- "डेल" - एचटीएमएल दस्तऐवज प्रकाशित केल्यानंतर काही तुकडा हटवला गेला हे दाखवायचे असताना स्ट्राइकथ्रूसह हायलाइट करणे
- "इन्स" - एचटीएमएल दस्तऐवजाच्या प्रकाशनानंतर काही तुकडा घातला गेला हे दर्शविण्याची आवश्यकता असताना अधोरेखित करणे
मी पुन्हा एकदा सांगतो की, आता कोड लिहिताना हे फॉरमॅटिंग टॅग फार क्वचितच आढळतात, परंतु तरीही त्यांचा उद्देश जाणून घेणे अनावश्यक नाही.
तुला शुभेच्छा! ब्लॉग साइटच्या पृष्ठांवर लवकरच भेटू
तुम्हाला स्वारस्य असेल
व्हाईटस्पेस वर्ण आणि Html मधील कोडचे त्यांचे स्वरूपन, तसेच विशेष वर्ण न मोडणारी जागाआणि इतर मेमोनिक्स 
एचटीएमएल आणि सीएसएस कोडमध्ये रंग कसे सेट केले जातात, टेबलमधील आरजीबी शेड्सची निवड, यांडेक्स आउटपुट आणि इतर प्रोग्राम निवडा, पर्याय, मजकूर, लेबल, फील्डसेट, लीजेंड - ड्रॉप-डाउन सूची आणि मजकूर फील्डच्या स्वरूपासाठी एचटीएमएल टॅग 
Html कोडमधील सूची - UL, OL, LI आणि DL टॅग 
हायपरलिंक (A, Href, Target blank) कशी तयार करावी, साइटवर नवीन विंडोमध्ये ती कशी उघडायची आणि Html कोडमध्ये चित्राची लिंक कशी बनवायची 
Html मधील टेबल्स - टेबल, Tr आणि Td टॅग, तसेच Colspan, Cellpadding, Cellspacing आणि Rowspan तयार करण्यासाठी 
Html 4.01 मानकांनुसार H1-H6, क्षैतिज रेषा Hr, लाइन ब्रेक Br आणि परिच्छेद P चे टॅग्ज आणि विशेषता 
हायपरटेक्स्ट भाषा काय आहे HTML मार्कअपआणि W3C व्हॅलिडेटरमधील सर्व टॅगची सूची कशी पहावी 
Img - चित्र (Src) घालण्यासाठी Html टॅग, त्याच्याभोवती मजकूर संरेखित करणे आणि गुंडाळणे (संरेखित करणे), तसेच पार्श्वभूमी सेट करणे (पार्श्वभूमी) 
एचटीएमएल कोडमधील टिप्पणी निर्देश आणि डॉक्टाइप, तसेच ब्लॉक आणि इनलाइन घटकांची संकल्पना (टॅग)
| ब्राउझर | इंटरनेट एक्सप्लोरर | नेटस्केप | ऑपेरा | सफारी | मोझीला | फायरफॉक्स | |||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| आवृत्ती | 5.5 | 6.0 | 7.0 | 6.0 | 7.0 | 8.0 | 7.0 | 8.0 | 9.0 | 1.0 | 1.7 | 1.0 | 2.0 |
| समर्थित | होय | होय | होय | होय | होय | होय | होय | होय | होय | होय | होय | होय | होय |
वर्णन
टॅग करा आकार, रंग आणि टाइपफेस यांसारखी फॉन्ट वैशिष्ट्ये बदलण्यासाठी एक कंटेनर आहे. जरी हा टॅग अद्याप सर्व ब्राउझरद्वारे समर्थित असला तरी, तो अप्रचलित मानला जातो आणि त्याचा वापर शैलींच्या बाजूने सोडून देण्याची शिफारस केली जाते.
मांडणी
मजकूर
टॅग बंद करणे
आवश्यक आहे.
पर्याय
रंग मजकूर रंग सेट करतो. face फॉन्ट टाइपफेस निर्दिष्ट करते. आकार पारंपारिक युनिट्समध्ये फॉन्ट आकार सेट करते.उदाहरण 1: टॅग वापरणे
पीया वाक्याचे पहिले अक्षर एरियल फॉन्टमध्ये लिहिलेले आहे, लाल रंगात हायलाइट केलेले आणि मोठे केले आहे.
टॅग पॅरामीटर्सचे वर्णन
COLOR पॅरामीटर
वर्णन
कंटेनरमध्ये मजकूराचा रंग सेट करतो .
मांडणी
...
युक्तिवाद
रंग मूल्य दोन प्रकारे सेट केले जाऊ शकते.
1. त्याच्या नावाने
ब्राउझर त्यांच्या नावाने काही रंगांना समर्थन देतात.
2. हेक्साडेसिमल मूल्यानुसार
हेक्साडेसिमल संख्या रंग निर्दिष्ट करण्यासाठी वापरली जातात. हेक्साडेसिमल प्रणाली, दशांश प्रणालीच्या विपरीत, तिच्या नावाप्रमाणे, 16 क्रमांकावर आधारित आहे. संख्या खालीलप्रमाणे असेल: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C, D, E, F. 10 ते 15 मधील संख्या बदलल्या आहेत लॅटिन अक्षरांसह. हेक्साडेसिमल सिस्टीममध्ये 15 पेक्षा जास्त संख्या दोन संख्या एकत्र करून तयार केल्या जातात. उदाहरणार्थ, दशांश मधील 255 ही संख्या हेक्साडेसिमलमधील FF क्रमांकाशी संबंधित आहे. संख्या प्रणाली निश्चित करताना गोंधळ टाळण्यासाठी, हेक्साडेसिमल नंबरच्या आधी हॅश चिन्ह # ठेवले जाते, उदाहरणार्थ #666999. तीन रंगांपैकी प्रत्येक - लाल, हिरवा आणि निळा - 00 ते FF पर्यंत मूल्ये घेऊ शकतात. अशा प्रकारे, रंग चिन्ह #rrggbb तीन घटकांमध्ये विभागले गेले आहे, जिथे पहिले दोन चिन्ह रंगाचा लाल घटक दर्शवतात, मधले दोन - हिरवे आणि शेवटचे दोन - निळे.
CSS प्रमाणेच
डीफॉल्ट मूल्य
ब्राउझरचा डीफॉल्ट रंग.
FACE पॅरामीटर
वर्णन
मजकूरासाठी वापरलेला फॉन्ट टाइपफेस निर्दिष्ट करण्यासाठी फेस पॅरामीटर वापरला जातो. तुम्ही स्वल्पविरामाने विभक्त केलेल्या अनेक फॉन्ट नावांची यादी करू शकता. या प्रकरणात, जर पहिला निर्दिष्ट फॉन्ट सापडला नाही, तर ब्राउझर सूचीतील पुढील फॉन्ट वापरेल.
मांडणी
...
युक्तिवाद
स्वल्पविरामाने विभक्त केलेल्या फॉन्ट नावांची कितीही संख्या. सार्वत्रिक फॉन्ट कुटुंबे:
सेरिफ - सेरिफ फॉन्ट (प्राचीन), जसे की टाइम्स;
sans-serif - sans-serif फॉन्ट (सेरिफ किंवा sans serifs शिवाय फॉन्ट), एक विशिष्ट प्रतिनिधी Arial आहे;
cursive - कर्सिव्ह फॉन्ट;
कल्पनारम्य - सजावटीचे फॉन्ट;
मोनोस्पेस - मोनोस्पेस फॉन्ट, या कुटुंबातील प्रत्येक वर्णाची रुंदी समान आहे.
CSS प्रमाणेच
डीफॉल्ट मूल्य
ब्राउझरमधील डीफॉल्ट फॉन्ट.
SIZE पॅरामीटर
वर्णन
1 ते 7 पर्यंत अनियंत्रित एककांमध्ये फॉन्ट आकार निर्दिष्ट करते. डीफॉल्टनुसार वापरलेला सरासरी आकार 3 आहे. फॉन्ट आकार एकतर निरपेक्ष मूल्य (उदाहरणार्थ, size="4" ) किंवा संबंधित मूल्य म्हणून निर्दिष्ट केला जाऊ शकतो (उदाहरणार्थ , size="+1" , size="-1" ). नंतरच्या प्रकरणात, आकार बेसच्या तुलनेत बदलतो. फॉन्ट आकार केवळ निर्दिष्ट आकाराच्या पॅरामीटरनेच नव्हे तर फॉन्ट टाइपफेसच्या निवडीद्वारे देखील प्रभावित होतो. अशा प्रकारे, एरियल फॉन्ट टाइम्स फॉन्टपेक्षा मोठा दिसतो आणि वर्डाना फॉन्ट एरियल फॉन्टपेक्षा थोडा मोठा आहे. फॉन्ट आणि त्याचा आकार निवडताना हे वैशिष्ट्य लक्षात घ्या.
मांडणी
...
युक्तिवाद
1 ते 7 पर्यंत पूर्णांक, किंवा + आणि - चिन्हे वापरून मूल्य वर किंवा खाली बदलणे.
टॅग करा आकार, रंग आणि टाइपफेस यांसारखी फॉन्ट वैशिष्ट्ये बदलण्यासाठी एक कंटेनर आहे. जरी हा टॅग अद्याप सर्व ब्राउझरद्वारे समर्थित असला तरी, तो अप्रचलित मानला जातो आणि त्याचा वापर शैलींच्या बाजूने सोडून देण्याची शिफारस केली जाते.
मांडणी
मजकूर
टॅग बंद करणे
आवश्यक आहे.
पर्याय
रंग मजकूर रंग सेट करतो. face फॉन्ट टाइपफेस निर्दिष्ट करते. आकार पारंपारिक युनिट्समध्ये फॉन्ट आकार सेट करते.उदाहरण 1: टॅग वापरणे
पीया वाक्याचे पहिले अक्षर एरियल फॉन्टमध्ये लिहिलेले आहे, लाल रंगात हायलाइट केलेले आणि मोठे केले आहे.
टॅग पॅरामीटर्सचे वर्णन
COLOR पॅरामीटर
वर्णन
कंटेनरमध्ये मजकूराचा रंग सेट करतो .
मांडणी
...
युक्तिवाद
रंग मूल्य दोन प्रकारे सेट केले जाऊ शकते.
1. त्याच्या नावाने
ब्राउझर त्यांच्या नावाने काही रंगांना समर्थन देतात.
2. हेक्साडेसिमल मूल्यानुसार
हेक्साडेसिमल संख्या रंग निर्दिष्ट करण्यासाठी वापरली जातात. हेक्साडेसिमल प्रणाली, दशांश प्रणालीच्या विपरीत, तिच्या नावाप्रमाणे, 16 क्रमांकावर आधारित आहे. संख्या खालीलप्रमाणे असेल: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C, D, E, F. 10 ते 15 मधील संख्या लॅटिन अक्षरांनी बदलली आहेत. हेक्साडेसिमल सिस्टीममध्ये 15 पेक्षा जास्त संख्या दोन संख्या एकत्र करून तयार केल्या जातात. उदाहरणार्थ, दशांश मधील 255 ही संख्या हेक्साडेसिमलमधील FF क्रमांकाशी संबंधित आहे. संख्या प्रणाली निश्चित करताना गोंधळ टाळण्यासाठी, हेक्साडेसिमल नंबरच्या आधी हॅश चिन्ह # ठेवले जाते, उदाहरणार्थ #666999. तीन रंगांपैकी प्रत्येक - लाल, हिरवा आणि निळा - 00 ते FF पर्यंत मूल्ये घेऊ शकतात. अशा प्रकारे, रंग चिन्ह #rrggbb तीन घटकांमध्ये विभागले गेले आहे, जिथे पहिले दोन चिन्ह रंगाचा लाल घटक दर्शवतात, मधले दोन - हिरवे आणि शेवटचे दोन - निळे.
CSS प्रमाणेच
डीफॉल्ट मूल्य
ब्राउझरचा डीफॉल्ट रंग.
FACE पॅरामीटर
वर्णन
मजकूरासाठी वापरलेला फॉन्ट टाइपफेस निर्दिष्ट करण्यासाठी फेस पॅरामीटर वापरला जातो. तुम्ही स्वल्पविरामाने विभक्त केलेल्या अनेक फॉन्ट नावांची यादी करू शकता. या प्रकरणात, जर पहिला निर्दिष्ट फॉन्ट सापडला नाही, तर ब्राउझर सूचीतील पुढील फॉन्ट वापरेल.
मांडणी
...
युक्तिवाद
स्वल्पविरामाने विभक्त केलेल्या फॉन्ट नावांची कितीही संख्या. सार्वत्रिक फॉन्ट कुटुंबे:
सेरिफ - सेरिफ फॉन्ट (प्राचीन), जसे की टाइम्स;
sans-serif - sans-serif फॉन्ट (सेरिफ किंवा sans serifs शिवाय फॉन्ट), एक विशिष्ट प्रतिनिधी Arial आहे;
कर्सिव्ह - तिर्यक फॉन्ट;
कल्पनारम्य - सजावटीचे फॉन्ट;
मोनोस्पेस - मोनोस्पेस फॉन्ट, या कुटुंबातील प्रत्येक वर्णाची रुंदी समान आहे.
CSS प्रमाणेच
डीफॉल्ट मूल्य
ब्राउझरमधील डीफॉल्ट फॉन्ट.
SIZE पॅरामीटर
वर्णन
1 ते 7 पर्यंत अनियंत्रित एककांमध्ये फॉन्ट आकार निर्दिष्ट करते. डीफॉल्टनुसार वापरलेला सरासरी आकार 3 आहे. फॉन्ट आकार एकतर निरपेक्ष मूल्य (उदाहरणार्थ, size="4" ) किंवा संबंधित मूल्य म्हणून निर्दिष्ट केला जाऊ शकतो (उदाहरणार्थ , size="+1" , size="-1" ). नंतरच्या प्रकरणात, आकार बेसच्या तुलनेत बदलतो. फॉन्ट आकार केवळ निर्दिष्ट आकाराच्या पॅरामीटरनेच नव्हे तर फॉन्ट टाइपफेसच्या निवडीद्वारे देखील प्रभावित होतो. अशा प्रकारे, एरियल फॉन्ट टाइम्स फॉन्टपेक्षा मोठा दिसतो आणि वर्डाना फॉन्ट एरियल फॉन्टपेक्षा थोडा मोठा आहे. फॉन्ट आणि त्याचा आकार निवडताना हे वैशिष्ट्य लक्षात घ्या.
