CSS स्टाइलशीट का उपयोग करना
इसे बदलें:
<link rel="stylesheet" href="">
इसके लिये:
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
स्टाइलशीट का उपयोग करने के लिए आपको उन HTML तत्वों में एक वर्ग जोड़ना होगा जिन्हें आप स्टाइल करना चाहते हैं:
<div class="w3-container w3-black">
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</div>
एचटीएमएल / सीएसएस कंकाल
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>Page Title</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<style>
</style>
<script src=""></script>
<body>
<img src="img_la.jpg" alt="LA" style="width:100%">
<div class="w3-container w3-black">
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</div>
</body>
</html>
यह कैसे काम करता है यह देखने के लिए "इसे स्वयं आज़माएं" बटन पर क्लिक करें!
कंटेनर की पृष्ठभूमि का रंग चैती से बदलकर काला करने का प्रयास करें।
इसे आपने बनाया?
बधाई हो!
आपने अभी-अभी स्टाइल शीट का उपयोग करने की मूल बातें सीखी हैं।
पढ़ते रहो!
उत्तरदायी कैसे बनें
HTML कोड
<div class="w3-row">
<div class="w3-third">
<img src="img_avatar.png" alt="Name1" style="width:100%">
</div>
<div class="w3-third">
<img src="img_avatar.png" alt="Name2" style="width:100%">
</div>
<div class="w3-third">
<img src="img_avatar.png" alt="Name3" style="width:100%">
</div>
</div>
कार्ड कैसे बनाएं
वास्तव में उन्नत कुछ के लिए तैयार हैं?
HTML में बिजनेस कार्ड के बारे में क्या?
छवि और पाठ दोनों सहित।
Play with the code below for a while, until you think you got a grip on it.
After that, we will start coding really fantastic HTML pages.
John Doe
Engineer
HTML Code
<div class="w3-card" style="width:200px">
<img src="img_avatar.png" style="width:100%">
<div class="w3-container w3-center">
<p class="w3-xlarge">John Doe</p>
<p>Engineer</p>
</div>
</div>