कैसे करें - एक HTML बुक बनाएं
एक HTML बुक बनाना सीखें जो सभी डिवाइस, पीसी, लैपटॉप, टैबलेट और फोन पर काम करेगी।
सबसे पहले, एक बेसिक HTML पेज बनाएं
HTML वेबसाइट बनाने के लिए मानक मार्कअप भाषा है और CSS वह भाषा है जो HTML दस्तावेज़ की शैली का वर्णन करती है।
हम एक मूल HTML पुस्तक बनाने के लिए HTML और CSS को मिलाएंगे।
सबसे पहले HTML कंकाल से शुरुआत करें:
उदाहरण
<!DOCTYPE html>
<html>
<head>
<title>My Book</title>
<meta charset="UTF-8">
</head>
<body>
<h1>My Book</h1>
<p>HTML book created by me.</p>
</body>
</html>
उदाहरण समझाया गया
<!DOCTYPE html>
दस्तावेज़ प्रकार HTML है<html> </html>
दस्तावेज़ की शुरुआत और अंत<head> </head>
दस्तावेज़ जानकारी की शुरुआत और अंत<title>
किताब का शीर्षक ("मेरी किताब")<meta charset="UTF-8">
प्रयुक्त वर्ण सेट (UTF-8)<body> </body>
दृश्यमान सामग्री की शुरुआत और अंत<h1> </h1>
शीर्षक की शुरुआत और अंत<p> </p>
पैराग्राफ की शुरुआत और अंत
ऊपर वर्णित कोड HTML टैग हैं।
HTML टैग का उपयोग HTML दस्तावेज़ की सामग्री को परिभाषित करने के लिए किया जाता है।
टैग एक <
(कम-से-चिह्न) से शुरू होते हैं और एक
>
(अधिक-से-चिह्न) के साथ समाप्त होते हैं।
इस तरह <p>
और </p>
एक पैराग्राफ की शुरुआत और अंत को चिह्नित करने के लिए उपयोग किया जाता है।
नोट: यदि आप HTML का विस्तार से अध्ययन करना चाहते हैं, तो कृपया हमारा HTML ट्यूटोरियल पढ़ें ।
<html>
पूरी तरह से सही होने के लिए, पुस्तक में प्रयुक्त भाषा को परिभाषित करने के लिए टैग में एक भाषा विशेषता जोड़ी जानी चाहिए :
<html lang="en">
निम्नलिखित मेटा जानकारी जोड़ने से आपकी पुस्तक सभी उपकरणों, पीसी, लैपटॉप, टैबलेट और फोन पर सही ढंग से प्रदर्शित होगी:
<meta name="viewport" content="width=device-width, initial-scale=1">
उदाहरण
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Book</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h1>My Book</h1>
<p>HTML book created by me.</p>
</body>
</html>
सामग्री तालिका बनाएं
<body> </body>
तत्वों के अंदर , सामग्री की एक तालिका जोड़ें:
<body>
<h1>Philosopy</h1>
<h3>Table of Contents</h3>
<p>1. Metaphysics</p>
<p>2. Epistemology</p>
<p>3. Logics</p>
<p>4. Ethics</p>
<p>5. Aesthetics</p>
</body>
कुछ स्टाइल जोड़ें
अपनी पुस्तक में स्टाइलशीट जोड़ें:
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
नोट: यदि आप CSS का विस्तार से अध्ययन करना चाहते हैं, तो कृपया हमारा CSS Tutorial पढ़ें ।
अध्याय 1 के लिए एक HTML पृष्ठ बनाएँ
फ़ाइल: दर्शन_अध्याय 1.htm
<body class="w3-content">
<div class="w3-container">
<h1>1. Metaphysics</h1>
<h3>The nature of reality.</h3>
<p>Metaphysics is the part of philosophy that studies the nature of reality.</p>
<p>When we look around, we can see:</p>
<ul>
<li>Nature</li>
<li>Animals</li>
<li>People</li>
<li>Houses</li>
<li>Cars</li>
<li>and much more</li>
</ul>
<p>Is this Virtual Reality real?</p>
<p>In Metaphysics, the questions is:</p>
<ul>
<li>What is real?</li>
<li>Is what we see real?</li>
<li>Is there more than we see?</li>
<li>Is there more than we sence?</li>
<li>Is there something else?</li>
<li>Is there something more?</li>
<li>Is there another dimension?</li>
</ul>
</div>
</body>
अध्याय 1 के लिए एक लिंक जोड़ें
<body>
<h1>Philosopy</h1>
<h3>Table of Contents</h3>
<p><a href="philosophy_chapter1.htm">1. Metaphysics</a></p>
<p>2. Epistemology</p>
<p>3. Logics</p>
<p>4. Ethics</p>
<p>5. Aesthetics</p>
</body>
ऊपर के उदाहरण में, हमने किताब के पहले अध्याय का नाम दिया है:
" दर्शन_अध्याय1 .htm "।
उपयोग करने के लिए नाम आप पर निर्भर है। शायद इसे "तत्वमीमांसा" कहा जाना चाहिए।
वैसे भी, ऊपर की तरह जारी रखें और अन्य अध्याय बनाएं:
"philosophy_chaper2.htm"
"philosophy_chaper3.htm"
"philosophy_chaper4.htm"
"philosophy_chaper5.htm"
प्रत्येक अध्याय के लिए एक लिंक जोड़ें
<body>
<h1>Philosopy</h1>
<h3>Table of Contents</h3>
<p>
<a href="philosophy_chapter1.htm">1. Metaphysics</a>
</p>
<p>
<a href="philosophy_chapter2.htm">2. Epistemology</a>
</p>
<p>
<a href="philosophy_chapter3.htm">3. Logics</a>
</p>
<p>
<a href="philosophy_chapter5.htm">4. Ethics</a>
</p>
<p>
<a href="philosophy_chapter4.htm">5. Aesthetics</a>
</p>
</body>