Style Attribute
हेलो दोस्तों तो आज हम HTML के Style Attribute के बारे में जानेंगे तो चलिए सुरु करते है।
Style Attribute का Use Html के किसी टैग पर Style देने के लिए किया जाता है वैसे तो Style के लिए CSS का उपयोग किया जाता है. लेकिन, आप सिर्फ HTML की मदद से भी कुछ सीमा तक एक HTML Document को अपने हिसाब से Style कर सकते है. यहाँ Style से मतलब है
चलो एक Example से समझते है आपने Paregraph Tag के बारे में तो पिछली पोस्ट में पड़ा होगा अगर नहीं तो में आपसे resquest करूंगा आप उससे पढ़िए तो आपको समझने में आसानी होगी तो जैसे हम Paregraph Tag में कोई भी Text लिखते है तो वो आपने देखा होगा उसका उसका color ,Font ,Size आदि सब normal by defalte fixied रहते है तो अगर हमे उसके कलर ,फॉण्ट ,साइज आदि तो बदलना है तो हमारे यहाँ पर Style Attribute की जरूरत पड़ती है
इसकी मदत से हम ये सब कर सकते है और है यहाँ पर में बता दु की हम सिर्फ Paregraph Tag ही नहीं HTML के किसी भी Element या टैग पर हम अलग-अलग तरह की स्टाइल लगा सकते है चाहे वो Heading हो या Form आदि सभी पर हम अपनी Custom Style लगा सकते है, आमतौर पर, CSS को एक अलग CSS फ़ाइल या < head > tag के अंदर < style > tag में लिखा जाता है,
लेकिन एक तीसरा स्थान है जो मान्य भी है तीसरे स्थान पर आप CSS लिख सकते हैं, एक HTML tag के अंदर, style attribute का उपयोग करते हुए।
HTML Style tag के <head > tag में डाल दिया जा सकता है और एक वर्ग के रूप में लागू किया जाता है, या इसका उपयोग एक एकल element में Inline CSS लगाने के लिए किया जा सकता है।
हम Style Element को HTML Document की Mini CSS भी कहते है. क्योंकि इस Element के द्वारा आप एक Webpage की Inline CSS Define कर सकते है.
Webpage को design करने के लिए inline, internal और external css का इस्तेमाल किया जाता है | इन तीन प्रकार के CSS को एक साथ भी इस्तेमाल किया जा सकता है |
Inline CSS in HTML
inline CSS ये 'style' attribute द्वारा दी जाती है |
Inline CSS ये सिर्फ उसी element पर apply होती है जिस element पर उसे दिया जाता है |
Inline CSS ये अलग-अलग element के लिए अलग-अलग दी जाती है |
style attribute को < head > element पर या < body > element पर define किया जा सकता है
तो आज हम सिर्फ style attribute के बारे में जानेंगे और जो ये internal और external css का इस्तेमाल Css के Tutorial में जानेंगे अभी के लिए हम सिर्फ style attribute के बारे में पड़ेंगे।
तो अब आप को Style Attribute के बारे में जान गए होंगे तो अब इसके syntax को समझ लेते है की कैसे हम किसी HTML Tag पर ये Use करते है।
Style Attribute Syntax
तो जैसे आप Syntax देख सकते हो अगर हमें किसी भी HTML Tag पर स्टाइल लगाने है तो सबसे पहले हम उस Tag का नाम लिखते है फिर उसके बाद Style उसे करते है यहाँ पर property का मतलब की हम कोनसी स्टाइल लगाना चाहते है फिर हम Property के बाद हमें उसकी value देनी होती है।
Note: CSS Property और CSS Value Pre-defined होती है. मतलब इन्हे पहले से ही बना दिया गया है. आप इन्हे ही इस्तेमाल कर सकते है. आप खुद CSS Rule नही बना सकते है.
तो अब हम इसको एक Example की मदत से समझते है।
Example :
Output :
I am normal Text
I am red
I am blue
I am big
वैसे तो Style Attribute के बहुत से Use है पर आज हम जादातर जो हटम्ळ में Use किये जाते उनके उनके बारे में जानेंगे जैसे Background Color, Font, Font Family , Text Color ,Text-Size,Text-Aligment आदि कैसे Change कर सकते है जो चलिए सबको Example की मदत से समझते है।
Background Color
Background color Change करने के लिए Background-color property हम Define करते है फिर उसकी Value जो color हम define करना चाहते है जैसे निचे Example में बताया गया है
Code
Text Color
Text color Change करने के लिए color property हम Define करते है फिर उसकी Value जो color हम define करना चाहते है जैसे निचे Example में बताया गया है
Example
Fonts
Fonts Change करने के लिए font-family property हम Define करते है फिर उसकी Value जो Font हम define करना चाहते है जैसे निचे Example में बताया गया है
Example
Text Size
Text Size Change करने के लिए font-size property हम Define करते है फिर उसकी Value जितनी Size हम define करना चाहते है जैसे निचे Example में बताया गया है
Example
Text Alignment
Text Alignment Change करने के लिए text-align property हम Define करते है फिर उसकी Value में Position जैसे Center ,Left या Right हम define करना चाहते है जैसे निचे Example में बताया गया है