CSS में display प्रॉपर्टी के साथ काम करना
आप पहले से ही जानते हैं कि सभी टैग एक निश्चित
ब्लॉक मॉडल से संबंधित होते हैं। हालाँकि, इच्छा होने पर,
display प्रॉपर्टी की मदद से मॉडल को
बदला जा सकता है। इस प्रॉपर्टी के मान block की मदद से
एलिमेंट को ब्लॉक-लेवल बनाया जा सकता है, और
मान inline की मदद से - इनलाइन।
आइए span टैग्स को ऐसे बनाएं
कि वे ब्लॉक एलिमेंट्स की तरह व्यवहार करें:
<span>text</span>
<span>text</span>
<span>text</span>
span {
display: block;
width: 100px;
height: 100px;
border: 1px solid red;
margin-bottom: 20px;
}
:
और अब आइए div टैग्स को ऐसे बनाएं
कि वे इनलाइन एलिमेंट्स की तरह व्यवहार करें:
<div>text</div>
<div>text</div>
<div>text</div>
div {
display: inline;
width: 100px;
height: 100px;
border: 1px solid red;
}
:
मान लीजिए आपके HTML कोड में कई पैराग्राफ हैं। उन्हें ऐसे बनाएं कि वे इनलाइन एलिमेंट्स की तरह व्यवहार करें।
मान लीजिए आपके HTML कोड में कई लिंक्स हैं। उन्हें ऐसे बनाएं कि वे ब्लॉक एलिमेंट्स की तरह व्यवहार करें। उन्हें बॉर्डर, चौड़ाई और ऊंचाई दें।
