HTML पृष्ठ को एक उदाहरण र आधारभूत सिद्धान्तहरू

धेरै भाषाहरू आविष्कार, तर HTML को भाषा सबैभन्दा विशेष र vosstrebovan को छ। यो कार्यक्रम मा अन्य प्रमुख पहल को धेरै समावेश भएकोले। हाइपरटेक्स्ट मार्कअप भाषा (HTML) - धेरै मार्कअप भाषा विकासकर्ता वर्तमान ज्ञान को मन मा जब उपलब्ध बनेको छ।

वास्तवमा, HTML मा, त्यहाँ केही गाह्रो छ, र सबै भन्दा को कार्यक्रम र इन्टरनेट मान्छे देखि टाढा केही मिनेट मा नोटबुक मा HTML-पृष्ठ को स्थापना पूरा हुनेछ। उल्लेखनीय उदाहरण, सरलता, साँच्चै, सबैलाई सुलभ।

सामान्य विवरण

HTML फाइल - एक पृष्ठ साइट, हुनत यो debatable छ, तर एक यो स्पष्ट छ सुरु लागि के, प्रति पृष्ठ एक फाइल हो।

HTML फाइल निर्दिष्ट एक DOCTYPE हेडर सुरु फाइलको प्रकार - HTML। सबै पृष्ठ तत्व (ट्याग) कोण कोष्ठक भित्र संकेत गर्दै हुनुहुन्छ। प्रत्येक जोडी ( "<" र ">") एक ट्याग HTML समावेश छ। सामान्यतया HTML ट्याग, त्यो छ, हरेक «ट्याग» लागि जोडी छ «/ ट्याग» छन्। दुवै कोण कोष्ठक मा संलग्न छन्। संक्रमण अर्को लाइन गर्न - त्यहाँ एक ट्याग, जो सबैभन्दा लोकप्रिय «BR /» छ।

टाउको र शरीर: केवल दुई ट्याग समावेश जो यो आफैलाई, HTML, - फाइल मा सबै भन्दा ठूलो ट्याग। पहिलो मामला मा, फरक विशिष्टीकरण अन्य उचित पृष्ठ फाइलहरूका लिङ्क वर्तमान PHP र जाभास्क्रिप्ट लिपि हुन सक्छ को संकेत गर्दै छन्। दोस्रो पृष्ठ लिखित सामग्री। पनि ट्याग र लिपि को रूप मा।

सरल HTML-पृष्ठ

यस्तो पृष्ठ सिर्जना उदाहरण तल लेखमा संकेत छ। ध्यान दिएर यो विचार गर्नुहोस्।

टाउको खण्ड

मुख्य उद्देश्य टाउको ट्याग - पृष्ठ र सामान्य लिपि को एक सामान्य वर्णन, हुनत बाद - सिर्फ एक नातेदार अवधारणा। सामान्यतया त्यहाँ केवल दुई कुराहरू धेरै महत्त्व संलग्न:

• किवर्ड र पृष्ठ को विवरण;
• अन्य फाइलहरू लिङ्क (* .CSS र * .js)।

जहाँ केही अन्य फाइलहरू ट्याग र अन्य लिपि भाषाहरूको लागि CSS नियम छ यसलाई संकेत गर्छ किनभने यो खण्ड को पृष्ठ सामग्रीको सामग्री प्रदर्शन गर्न मात्र अप्रत्यक्ष महत्त्व छ।

HTML-पृष्ठ एक आगन्तुक जहाँ पृष्ठ खुलेको छ ट्याब माथि तपाईँको माउस ल्याउँछ जब प्रदर्शित हुन्छ जो शीर्षक (TITLE), छ। यो पठनीय पाठ हस्ताक्षर पृष्ठ भन्न धेरै दिन लायक, सजिलो, बनाउँछ किनभने यो, महत्त्वपूर्ण छ।

मेटा-ट्याग सामान्य वेब कार्यक्रम महत्त्वपूर्ण हो, तर जब यो एक नोटबुक, खराब अव्यवस्था निरर्थक संरचना एउटा उदाहरण मा HTML-पृष्ठ सिर्जना आवश्यक छ।

लिङ्क र लिपि लिंक मा विशेष ध्यान गर्नुपर्छ। जाभास्क्रिप्ट-कोड फाइल स्थान - पहिलो जहाँ त्यहाँ एक CSS शैलीपाना फाइल, दोस्रो एक ठाउँमा बुझाउँछ। यस्तो लिंक सेट गर्न सकिन्छ।

तपाईं लिपि एउटा HTML ज्ञान व्यवहार गर्नुपर्छ प्रयोग गर्नुहुन्छ भने बलियो हुनेछ, तपाईं ध्यान क्यासकेडिङशैलीपाना पानाहरू मा तुरुन्तै भुक्तानी गर्नुपर्छ। सीएसएस फाइलहरू HTML ट्याग को दर्ता को नियम विशेष छन्,।

खण्ड शरीर

वास्तवमा, एक नमूना पृष्ठ HTML - यो शरीर खण्ड छ। यो सबै जानकारी, सामग्री पृष्ठ को सबै समावेश यहाँ छ। सबै जानकारी यस्तो जाभास्क्रिप्ट-कोड वा PHP-कार्यक्रम को टुक्रा सम्मिलित रूपमा ट्याग र लिपि, को रूप मा प्रस्तुत गरिएको छ।

यो यस्तो नोटप्याड रूपमा एउटा पाठ सम्पादक मा ब्राउजर र एउटै उदाहरण मा HTML वेब पेजहरु को उदाहरण, यो छैन नै कुरा हो भन्ने महसुस गर्न महत्त्वपूर्ण छ। पहिलो मामला मा हामी सबै लिपिहरू कार्यान्वयन जसमा तयार HTML-पाठ हो। उदाहरणका लागि, PHP यसको भाग पूरा र सही ठाउँमा पनि ट्याग मा कोड को सट्टा गठन गरेको छ। जाभास्क्रिप्ट पनि यसको बारे अहिलेसम्म अलग कुराकानी हुन यद्यपि, यसको मिशन पूरा गर्नुभयो।

HTML - यो लिपि को सट्टा ट्याग। अन्ततः, केवल ब्राउजर प्रदर्शित पृष्ठ को सामग्री, तर यसको ट्याग। कुनै PHP-कोड त्यहाँ छैन।

मात्र बुट समय (अधिभार) मा, पृष्ठ सेवा गर्न, तर क्षणमा पृष्ठ को आगन्तुक ब्राउजरमा हुँदा र अध्ययन यसलाई - जाभास्क्रिप्ट एक विशेष स्थिति, आफ्नो हेरविचार छ।

एक सरल उदाहरण कोड HTML-पृष्ठ को (केवल शरीर खण्ड) तल देखाइएको छ।

एक आगन्तुक ब्राउजरमा यो तल देखाइएको देखिन्छ।

कोड मा निर्दिष्ट गरिएको छैन ब्राउजर ल्याएको तत्व जस्तो हुनुपर्छ। सबै डिजाइन सीएसएस नियम देखिने छ। यस मामला मा, Mcss सन्दर्भित (हेर्नुहोस्। पृष्ठ HTML को पहिलो उदाहरण) थियो / scPhpWordRW.css फाइल।

HTML, CSS विषय छरितो छ नभई धेरै सुलभ नियम छ र HTML-पृष्ठ सिर्जना उदाहरण नोटप्याड भन्दा अन्य केहि आवश्यक गर्दैन जब आफ्नो नम्बर, सानो छ। सबै तत्काल विकासको लागि धेरै सुलभ छ:

vDoc-लोगो-h.png प्रदर्शन - यो माउस यो भन्दा बढी छ जब यो ट्याग scLogo_vDoc वर्णन गरिएको छ कसरी सजिलो देखाउँछ, र यो विवरण ट्याग एक सामान्य अवस्थामा एक तस्वीर vDoc-logo.png प्रदर्शन गर्दछ, र।

एचटीएमएल वर्णन को संरचना

भाषा पूरा अवधारणा को संरचना र विन्यास को कुनै पनि समावेश गर्दैन यहाँ धेरै नातेदार छ। कुनै चर हो, तर त्यहाँ मौका प्रशस्त छन्। हाइपरटेक्स्ट को मौलिक आधार त्यहाँ एउटा तत्व (ट्याग) नाम छ यकीन छ कि छ भन्ने छ।

उचित नाम (tagName) र कोण कोष्ठक बनेको मामला को नाम, ट्याग जोडी, ( «<» + tagName + «>»), यदि हामी ट्याग को शुरुवात, र बारेमा कुरा गर्दै «», यदि रेकर्ड यसको अन्त्य।

तलको पाठ स्थित विशेषताहरु वर्णन HTML पृष्ठ को उदाहरण।

विशेषताहरु हुन सक्छ ट्याग, त्यसपछि तिनीहरूले एक ठाउँ मार्फत ट्याग नाम पछि बन्द कोण कोष्ठक अघि राखे छन् ">"। तिनीहरूले मात्र सुरुमा ट्याग रेकर्ड गरिएको छ भने गुण। ट्याग सामग्री जो सुरु ट्याग र यो अन्त बीच निहित छ।

कुल HTML सामग्री वर्णन

HTML तपाईं ब्लक र इनलाइन तत्व वर्णन गर्न अनुमति दिन्छ। ब्राउजर सञ्झ्यालमा एक निश्चित क्षेत्र अवस्थित गर्न सकिन्छ पहिलो कब्जा बिल्कुल, कि प्रदर्शन HTML-पृष्ठ को क्षेत्र मा सही ठाउँमा छ, र एक विशिष्ट आकार छ।

इनलाइन तत्व साधारण पृष्ठ फाइल मा यसो भनिएको थियो रूपमा, र स्क्रिनमा प्रदर्शित, छ, एक मुद्दा देखिन्छन्। पृष्ठ लोड हुन्छ जब कुल प्रवाह प्रदर्शन प्रभावित हुन सक्छन्। नियुक्ति, दृश्यात्मक र ब्लक तत्व अन्य गुण कुनै पनि समय जाभास्क्रिप्ट-कोड मार्फत मा प्रभावित हुन सक्छन्।

सरल तत्व साथै, HTML को टेबल र प्रकारका वर्णन गर्न प्रदान गर्दछ। यी तत्व मा मांग मा धेरै छन् "दैनिक साइट निर्माण।"

तालिका को विवरण: ट्याग तालिका, tr, टीडी

तालिका ट्याग तालिका सिर्जना गर्न प्रयोग गर्न सक्छ, टीडी कक्षहरू को एक नम्बर को लागि एक पंक्ति मा पङ्क्ति र TR एक नम्बर निर्दिष्ट गर्नुहोस्। संगठनको सामान्य तालिका, प्रकृति HTML-मार्कअप टेबुलर यो घोषणा सीमित संगठन कारण, गर्न विपरीत किनभने यदि विकासकर्ता एक आयताकार तालिका नै सबै पङ्क्तिहरू स्तम्भहरू संख्या, त्यसपछि यो आफैलाई लागि भनेर पालना गर्नुपर्छ जसमा गर्न चाहन्छ।

HTML को सैद्धान्तिक स्थिति: जो छ, तर केही बुझिएन छ। केही अवस्थामा यो तालिका प्रत्येक पङ्क्ति स्तम्भहरू संख्या त महत्त्वपूर्ण छ, तर तपाईं तेर्सो वा ठाडो एक मर्ज कक्षहरू गर्न चाहनुहुन्छ भने, यो धेरै ध्यान दिएर सबै गणना गर्न आवश्यक छ।

एक सरल तालिकाको एउटा विवरण संग उदाहरण HTML पृष्ठमा चित्रात्मक लेख मा देखाइयो।

स्तम्भ हेडर - यहाँ तीन स्तम्भहरू द्वारा तीन पङ्क्तिहरू को आकार देखाउन तालिका, पहिलो पंक्ति ट्याग वें टीडी ट्याग सट्टा प्रयोग भएको थियो छ। विशेष यी दुई ट्याग छैन प्रतिष्ठित, तर यो तालिका को पहिलो पङ्क्ति बीच भेद पहिलो प्रयोग गर्न सम्भव छ, र वें गर्न CSS मा, तपाईं यसलाई अन्य टीडी देखि distinguishes जो आफ्नो आफ्नै शैली, संलग्न गर्न सक्नुहुन्छ।

विवरण फारम: फर्म ट्याग, इनपुट

फारम - यो HTML-ट्याग सबैभन्दा माग भाग हो। प्रयोग प्रकारका सूचना गर्न सक्नुहुन्छ। वास्तवमा, पृष्ठ - यो प्रदर्शन जानकारी, तर फारम - आगत।

एक सरल फारम को विवरण संग उदाहरण HTML पृष्ठमा:

धेरै प्रकारका प्रयोग गर्दछ, तर निम्नानुसार मुख्य विशेषताहरु हो। तपाईं आगत फिल्डमा निर्दिष्ट गर्न सक्नुहुन्छ, तपाईँ तिनीहरूलाई प्रयोगकर्ता इनपुट को विश्लेषण लागि डिजाइन र घटना हेण्डलरहरू नियुक्त गर्न आवश्यक छ। तपाईं एक लुकेका क्षेत्र निर्दिष्ट र पृष्ठ पृष्ठभूमि जानकारी प्रसारित गर्न सक्नुहुन्छ। तपाईं डाटा स्थानान्तरण प्रक्रिया शुरू थिचेर, जानकारी प्रसारण बटन निर्दिष्ट गर्न सक्नुहुन्छ।

HTML प्रयोग

हाइपरटेक्स्ट भाषा जान्न - इन्टरनेट कार्यक्रम क्षेत्रमा कुनै पनि काम विशेषज्ञता लागि अपरिहार्य शर्त, तर तपाईं PHP वा JavaScript मा एक कार्यक्रम लेख्न चाहनुहुन्छ भने, त्यसपछि थाहा HTML + CSS पूर्ण आवश्यक छ।

PHP भाषा अघिल्लो उदाहरण मा पहिचान गरिएको छ। यो फारम संग एक पृष्ठ भर्नुभएको क्षेत्रहरू संग ब्राउजरमा सर्भरबाट उड्यो किनभने PHP, सर्भर मा चल्छ। विशेष, TestOnBlur कार्यहरु ट्याग इनपुट (onblur घटना सञ्चालनकर्ता) मा उल्लेख, पाठ फिल्ड को रूप मा सबै मापदण्डहरु पाए।

ब्राउजर चल्छ JavaScript, र ठीक डाटा फिर्ता सर्भर बटन पठाउन काम गर्न, छ, डिजाइन :. क्लिकमा = jQuery ( 'गर्न #') Val ( 'गाडी'), यो आवश्यक थाहा छैन मात्र के jQuery बारेमा छ, तर के #to, वैल, गाडी। थप ठीक, यो आधारभूत HTML ट्याग र तिनीहरूलाई सीएसएस शैलीहरू लागू सामान्य नियम थाहा आवश्यक छ।

यो चाँडै इन्टरनेट कार्यक्रम को क्षेत्र मा कुनै पनि विशेषज्ञता को योग्यता जुटाउने पर्याप्त छ।