HTML हाइलाइटिंग: बोल्ड, इटैलिक और कलर टेक्स्ट। Html में एक अच्छा फॉन्ट कैसे बनाया जाता है: साइज़, कलर्स, html फॉन्ट टैग I टैग के साथ

टैग HTML में इसका उपयोग टेक्स्ट इटैलिक का एक टुकड़ा बनाने के लिए किया जाता है।

HTML टैग भौतिक स्वरूपण टैग को संदर्भित करता है। टैग का उपयोग करके फ़ॉन्ट शैली बदलें प्रकृति में शैलीगत है।

आप टैग का उपयोग करके HTML टेक्स्ट को इटैलिक भी बना सकते हैं। इस मामले में, पाठ को तार्किक रूप से हाइलाइट किया जाएगा (अर्थ से), "रेखांकित"।

HTML5 विनिर्देशन तार्किक स्वरूपण टैग को प्राथमिकता देने की सिफारिश करता है: महत्वपूर्ण पाठ टुकड़े - एक टैग, जोर - एक टैग, सबहेडिंग - टैग, पाठ हाइलाइटिंग - एक टैग। किसी टैग के साथ टेक्स्ट को इटैलिक करें केवल तभी चयन करता है जब चयन वर्ण किसी भी तार्किक स्वरूपण टैग से मेल नहीं खाता।

सभी प्रकार के पाठ चयन लेख में वर्णित हैं:।

वाक्य - विन्यास

इटैलिकाइज़्ड टेक्स्ट

ब्राउज़र प्रदर्शन

उपयोग उदाहरण HTML कोड में




HTML में इटैलिक टैग


सरल पाठ जो किसी भी साइट पर स्थित हो सकता है। और यहाँ इटैलिक में पाठ है (

सभी को पता है कि टैग , , , प्रस्तुति हैं, और इसलिए, प्रतिमान "संरचना, प्रस्तुति, व्यवहार" के आधार पर, उनके उपयोग को प्रोत्साहित नहीं किया जाता है। तत्व अधिक परिचित लगते हैं , , ... यह कई वर्षों के विकास अभ्यास का मामला रहा है। हालाँकि, HTML5 के आगमन के साथ इन तत्वों के शब्दार्थों में बहुत बदलाव आया है। अब हमारे पास अर्थ के साथ 4 नए टैग हैं और हमारे सिर में गड़बड़ है।

बनाम

यदि पहले लेआउट पर सभी पाठ्यपुस्तकें "उपयोग" जैसे वाक्यांशों से भरी थीं बजाय ", और यह आधा सच था, फिर आज इस तरह की आदत एक दुष्ट शब्दार्थ मजाक खेल सकती है। और बात यह है कि HTML5 लेखक उपयोग करने का सुझाव देते हैं पाठक का ध्यान आकर्षित करने के लिए पाठ के अंशों को उजागर करने के लिए, लेकिन पाठ के अर्थ में वृद्धि या घुसपैठ के बिना। किसी दस्तावेज़ में कीवर्ड को चिह्नित करने के लिए उपयोग के उदाहरण प्रदान करता है

frobonitor तथा barbinator घटक तले हुए हैं।

और लीड (पत्रकारिता में एक लेख का पहला पैराग्राफ)


पालतू खरगोश द्वारा बिल्ली के बच्चे "अपनाया"


छह परित्यक्त बिल्ली के बच्चे को एक अप्रत्याशित नई माँ का आंकड़ा मिला है - एक पालतू खरगोश।


वेटरनरी नर्स मेलानी हम्बले तीन हफ्ते की बिल्ली के बच्चे को अपने एबरडीन घर ले गई।


इसकी बारी में , जैसा कि पहले था, इसका मतलब है कि इसकी सामग्री का बढ़ा हुआ मूल्य।

बनाम

अब से इसमें वह पाठ शामिल है जो सामान्य वातावरण से बाहर है, लेकिन एक भावनात्मक अर्थ नहीं है। मेरी राय में, इसका उपयोग करना तर्कसंगत है जहां टाइपोग्राफिक परंपरा इटैलिक का सुझाव देती है (उदाहरण के लिए, एक विदेशी भाषा में शब्द, शब्द, आदि)

प्रति अपामार्ग विज्ञापन एस्ट्रा - लैटिन से अनूदित का अर्थ है "सितारों के लिए कठिनाइयों के माध्यम से।"

एक ही अर्थ है जोरदार तनाव, पाठ के दिए गए मार्ग पर भावनात्मक जोर। यह वह स्थिति है जब भाषण में हम शब्दों को एक स्वर (स्वर, मात्रा, आदि) के साथ उजागर करते हैं।

निष्पादन हेतु नहीं कर सकते हैं, दया कीजिए।

अनुबंध को ध्यान से पढ़ें!

"छोटे प्रिंट में पाठ" (ऐसी जानकारी जो एक कानूनी औपचारिकता है, जैसे कि एक उद्यम लाइसेंस या कानूनी पता, आदि), हम, एक नियम के रूप में, एक वर्ग के साथ एक तत्व के साथ चिह्नित होते हैं जो दृश्य उपयोगकर्ता एजेंटों में एक छोटा फ़ॉन्ट सेट करता है। अब हमारे शस्त्रागार में एक नया पुराना दिखाई दिया अर्थ तत्व - .

पवित्रा के बारे में

पूर्व स्ट्राइकथ्रू पाठ से ज्यादा कुछ नहीं था। अभी ऐसी जानकारी प्रस्तुत करता है जिसने इसकी प्रासंगिकता खो दी है।
हमारे पास एक आइटम भी है , जिसके परिणामस्वरूप दृश्य उपयोगकर्ता एजेंटों में डिफ़ॉल्ट रूप से स्ट्राइकथ्रू पाठ होता है। इसका मतलब है कि दस्तावेज़ में परिवर्तन, और पहली नज़र में, उनका उद्देश्य समान लग सकता है। हालांकि, यहां एक सूक्ष्म बिंदु है। एक ऑनलाइन स्टोर में उत्पाद पृष्ठ के एक उदाहरण पर विचार करें।
यह दो कीमतें दिखा सकता है, जिनमें से एक को पार कर लिया गया है। हम इसे एक तत्व के साथ चिह्नित करते हैं ... इसका मतलब यह है कि पुरानी कीमत ने अपनी प्रासंगिकता खो दी है (कोई फर्क नहीं पड़ता कि जब यह था, तथ्य स्वयं महत्वपूर्ण है)। जो नहीं है, उसकी जांच कैसे करें ? का तात्पर्य दस्तावेज़ में किए गए परिवर्तन(क्या मायने रखता है) कुछ समय में दस्तावेज़ को बदल दिया गया था)। हमारे मामले में, नए दस्तावेज़ में पहले से ही अप्रासंगिक जानकारी है।

नए शब्दार्थ और पुराने सिद्धांत

यदि किसी अज्ञात कारण से आप doctype को HTML 4.01 में एक नए और औपचारिक प्रकार के साथ बदल नहीं सकते हैं - निराशा न करें। नए अर्थ के साथ पुराने नए तत्वों का उपयोग करें और समय के साथ आप खुद को धन्यवाद कहेंगे। शायद कोई कहेगा कि यह गलत है, लेकिन आखिरकार, इन तत्वों को छोड़कर अमान्य भी नहीं हैं। इसके अलावा, एचटीएमएल 5 को मन में पिछड़ी संगतता के साथ डिजाइन किया गया था, और यह पुराने तत्वों के नए शब्दार्थ पर भी लागू होता है। कुछ भी मौलिक रूप से नहीं बदला है, और केवल एक अर्थपूर्ण पेपरकॉर्न जोड़ा गया है।

इस लेख में, हम टेक्स्ट का चयन करने के तरीके के बारे में बात करेंगे। इटैलिक में एचटीएमएल। बोल्ड टेक्स्ट के साथ, इटैलिकाइज़्ड टेक्स्ट को तीन तरीकों से बनाया जा सकता है:

  • टैग मैं एचटीएमएल;
  • टैग एम एचटीएमएल;
  • सीएसएस संपत्ति फ़ॉन्ट शैली.

आइए HTML में आप इटैलिक कैसे बना सकते हैं, इसके तीनों विकल्पों पर विचार करें, इस मुद्दे की सूक्ष्मताओं पर चर्चा करें और कुछ स्थितियों में उपयोग करने के लिए कौन से तरीके अधिक सुविधाजनक और अधिक सही हैं।

इटैलिक पाठ: टैग

टैग मैं (इटैलिक), टैग के समान ख बोल्ड टेक्स्ट के लिए, इसका उपयोग शारीरिक रूप से इटैलिक टेक्स्ट को हाइलाइट करने के लिए किया जाता है (इसका मतलब है कि केवल टेक्स्ट की शैली बदल जाती है)। टैग एप्लिकेशन मैं:

वेबसाइट निर्माता "Nubex"

इस प्रकार, पाठ का आवश्यक भाग टैग के बीच रखा गया है .

इटैलिक पाठ: टैग

हालांकि टैग मैं साइट ऑप्टिमाइज़ेशन के दृष्टिकोण से मान्य है, टैग का उपयोग करना बेहतर है एम पाठ के तार्किक रूप से महत्वपूर्ण वर्गों को उजागर करने के लिए। इसका मतलब है कि खोज रोबोट टैग के बीच रखे गए पाठ के महत्व को ध्यान में रखते हैं। :

वेबसाइट निर्माता "Nubex"

परिणाम:

वेबसाइट निर्माता "Nubex"

लेकिन यह मत भूलो कि पाठ टैग में संलग्न है मैं तथा एम, हालांकि वे लगभग सभी (सभी आधुनिक ब्राउज़रों में) प्रदर्शित होते हैं, उनके सार में वे काफी समान नहीं हैं, जैसा कि ऊपर उल्लेख किया गया है। इसलिए, आपको आवश्यकतानुसार टैग का उपयोग करने की आवश्यकता है: टैग एम HTML पाठ के महत्वपूर्ण खंडों को फ्रेम करता है, और टैग का उपयोग करके दृश्य इटैलिक डिज़ाइन लागू करता है मैं या सीएसएस शैलियों। अब आइए इटैलिक टेक्स्ट सेलेक्शन के लिए CSS स्टाइल्स का इस्तेमाल करते हैं।

सीएसएस द्वारा संचालित इटैलिक पाठ

CSS में फोंट प्रदर्शित करने के लिए शैलियों को सेट करने के लिए, संपत्ति का उपयोग करें फ़ॉन्ट शैली, जो निम्नलिखित मूल्यों पर ले जा सकते हैं: परोक्ष (इटैलिक टेक्स्ट), तिरछा (इटैलिक) और साधारण (नियमित फ़ॉन्ट)।

यह याद रखने योग्य है तिरछा फ़ॉन्ट और इच्छुक, उनके सार में, समान नहीं हैं। इटैलिक एक विशेष फ़ॉन्ट है जो हस्तलिखित पाठ के अनुरूप है, और इच्छुक नियमित फ़ॉन्ट को दाईं ओर झुकाने से बनता है।

एप्लिकेशन को अट्रैक्ट करें फ़ॉन्ट शैली अभ्यास पर:

सीएसएस के साथ इटैलिक - "नूबेक्स"

हमारी साइटें वास्तव में हैं, बहुत बड़ा कदम वेब विकास में।

हम असली के लिए करते हैं गुणवत्ता साइटों।

लेकिन यह याद रखना चाहिए कि कुछ ब्राउज़र संपत्ति के साथ पाठ करते हैं फ़ॉन्ट-शैली: तिरछा; इसे इटैलिक टेक्स्ट के रूप में नहीं, बल्कि इटैलिक के रूप में व्याख्यायित किया जा सकता है।

अब हम मुख्य टैग का अध्ययन करने जा रहे हैं। आइए पृष्ठ पर कौन से टैग आवश्यक हैं, इसकी संरचना बनाते हुए शुरू करें।

खंड मैथा। सबसे सरल पृष्ठ की संरचना

एक साइट पृष्ठ विस्तार के साथ एक सादा पाठ फ़ाइल है .html... इस फ़ाइल में टैग्स के साथ HTML पेज का टेक्स्ट है। इस फ़ाइल में निम्न टैग होने चाहिए: टैग , जिसमें संपूर्ण साइट का पाठ होना चाहिए (इस टैग के बाहर लिखी गई सभी चीज़ों को ब्राउज़र द्वारा अनदेखा किया जाएगा), और इसके अंदर दो और टैग होने चाहिए: टैग पृष्ठ और टैग की सेवा सामग्री के लिए - मुख्य पाठ के लिए, जो ब्राउज़र स्क्रीन पर दिखाई देता है।

सामग्री को सेवा के लिए जो टैग के अंदर स्थित है , कई अलग-अलग चीजें आती हैं, लेकिन अभी के लिए हमें उनमें से केवल दो की आवश्यकता है। यह एक टैग है , जो पेज का नाम सेट करता है, जो ब्राउज़र टैब और टैग में दिखाई देगा <meta> , जो पृष्ठ एन्कोडिंग सेट करता है (यह विशेषता में सेट है <b>चारसेट</b> और आमतौर पर मायने रखता है <b>utf-8</b>, वीडियो में इस पर अधिक, जो नीचे पैराग्राफ की एक जोड़ी होगी)।</p> <p>इसके अलावा, टैग से पहले <html> निर्माण आमतौर पर लिखा जाता है <b>doctype</b>, जो HTML भाषा के संस्करण को इंगित करता है जिसमें साइट बनाई गई है। भाषा का वर्तमान संस्करण संख्या पांच है और इसके लिए सिद्धांत इस तरह दिखना चाहिए -<!DOCTYPE html> .</p> <p>तो चलिए पृष्ठ की मूल संरचना पर एक नज़र डालते हैं (एक ब्राउज़र में इस उदाहरण को चलाने के लिए, इसे एक्सटेंशन वाली टेक्स्ट फ़ाइल में कॉपी करें <b>.html</b> और अगर आपको इसमें कोई समस्या है तो ब्राउज़र में खोलें - उदाहरण के नीचे वीडियो देखें):</p> <p> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>यह टाइटल टाइटल है यह पृष्ठ की मुख्य सामग्री है।

किसी ब्राउज़र में यह उदाहरण कैसा दिखता है, इसके लिए यह लिंक देखें।

मुझे लगता है कि पृष्ठ की मूल संरचना के बारे में पढ़ने के बाद, आपको अभी भी कुछ भ्रम है कि यह सब कैसे व्यवहार में दिखता है। इसलिए, मैंने एक विशेष वीडियो बनाया, जिसमें मैं आपको अपना पहला HTML पृष्ठ बनाने और इसे ब्राउज़र में चलाने का तरीका दिखाऊंगा (इसमें मैं आपको पृष्ठ शीर्षक के बारे में, एन्कोडिंग के बारे में, कोड डिज़ाइन के बारे में भी बताऊंगा)। इसे देखें और उसके बाद ही आगे पढ़ने के लिए आगे बढ़ें:

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

खंड मैथा। पैराग्राफ

पृष्ठ के मुख्य तत्वों में से एक हैं पैराग्राफ... उनकी तुलना एक पुस्तक में पैराग्राफ से की जा सकती है - प्रत्येक पैराग्राफ एक नई लाइन पर शुरू होता है और इसमें एक तथाकथित लाल रेखा होती है (यह तब होता है जब पैराग्राफ के पाठ की पहली पंक्ति दाईं ओर थोड़ी सी झुकी होती है)। डिफ़ॉल्ट रूप से कोई लाल रेखा नहीं है, लेकिन यह करना आसान है (बाद में उस पर अधिक)।

टैग का उपयोग करके एक पैराग्राफ बनाया गया है

इस प्रकार:

यह टाइटल टाइटल है

यह एक पैराग्राफ है।

यह एक और पैराग्राफ है।

और एक और पैराग्राफ।

यह एक पैराग्राफ है।

यह एक और पैराग्राफ है।

और एक और पैराग्राफ।

खंड मैथा। हेडिंग एच 1, एच 2, एच 3, एच 4, एच 5, एच 6

पैराग्राफ के अलावा, पृष्ठ पर महत्वपूर्ण हैं मुख्य बातें... उनकी तुलना किसी पुस्तक के शीर्षक से भी की जा सकती है - प्रत्येक अध्याय का अपना शीर्षक (इस अध्याय का शीर्षक) है और इसे पैराग्राफ में विभाजित किया गया है, जिसका अपना शीर्षक भी है। खैर, और पृष्ठ का मुख्य पाठ पैराग्राफ में है।

हेडर्स बनाए जाते हैं टैग का उपयोग करना

,

,

,

,

,
... उनके पास अलग-अलग डिग्री का महत्व है। शीर्षक में h1 होना चाहिए संपूर्ण HTML पृष्ठ का शीर्षक, में h2 - नाम ब्लॉक पृष्ठों में h3 - सबब्लॉक का नाम, और इसी तरह।

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

यह टाइटल टाइटल है

एच 1 हेडिंग

H2 शीर्षक

एच 3 हेडिंग

एच 4 हेडिंग

H5 शीर्षक
एच 6 हेडिंग

यह पहला पैराग्राफ है।

यह दूसरा पैराग्राफ है।

यह तीसरा पैराग्राफ है।

यह ब्राउज़र में कोड कैसे दिखेगा:

एच 1 हेडिंग

H2 शीर्षक

एच 3 हेडिंग

एच 4 हेडिंग

H5 शीर्षक
एच 6 हेडिंग

यह पहला पैराग्राफ है।

यह दूसरा पैराग्राफ है।

यह तीसरा पैराग्राफ है।

खंड मैथा। मोटे

आप पहले से ही जानते हैं कि डिफ़ॉल्ट हेडर हैं मोटे... हालांकि, आप सादे पाठ को भी बोल्ड बना सकते हैं - बस इसे टैग में ले जाएं ... उदाहरण देखें:

यह टाइटल टाइटल है

यह सामान्य पाठ है, और यह है मोटे पाठ।

यह ब्राउज़र में कोड कैसे दिखेगा:

यह सामान्य पाठ है, और यह है मोटे पाठ।

किसी अन्य टैग के अंदर उपयोग किया जाना चाहिए, जैसे कि एक पैराग्राफ। इस स्थिति में, पैराग्राफ पृष्ठ (पैराग्राफ और हेडिंग), और टैग की समग्र संरचना बनाते हैं ख पाठ के अलग-अलग टुकड़ों को बोल्ड बनाता है।

खंड मैथा। इटैलिक

फैटी के अलावा, आप भी बना सकते हैं इटैलिक टैग का उपयोग करना :

यह टाइटल टाइटल है

यह सामान्य पाठ है, और यह है तिरछा पाठ।

यह ब्राउज़र में कोड कैसे दिखेगा:

खंड मैथा। सूचियाँ

पैराग्राफ और हेडिंग के साथ, पेज का एक और महत्वपूर्ण तत्व है - यह है सूचियों... ऐसे तत्व शायद सभी इंटरनेट उपयोगकर्ताओं से परिचित हैं। वे किसी चीज़ की सूची (एक सूची) बिंदु द्वारा इंगित करते हैं। आमतौर पर सूची में प्रत्येक आइटम के बगल में एक भरा हुआ सर्कल होता है (इसे कहा जाता है निशान सूची)।

टैग का उपयोग करके सूची बनाई जाती है

© 2020 मोबाइल और कंप्यूटर गैजेट्स