इस chapter में हम बहुत important topic पर बात करने वाले हैं HTML CSS in Hindi में css क्या होती है इसका क्या इस्तेमाल है और ये किस किस तरीके से उपयोग की जा सकती है। Web डिजाइनिंग में css का बहुत महत्वपूर्ण स्थान है।
HTML Style CSS – CSS का full form Cascading Style Sheet होता है इसका use webpage की design और उसके layout की style के लिए किया जाता है। CSS की help से आप background-color, border-color, font-color, fonts, font-size, margin (elements के बीच का gap), padding (element के अन्दर का gap), elements की height width, screen size आदि को define कर सकते हैं।
Web Designing में CSS को 3 types से use किया जाता है या लिखा जाता है –
External CSS – CSS के ऐसे use के लिए हम एक अलग फाइल create करते हैं और उसी फाइल में css का code लिखते हैं और उसकी link अपने html पेज के head section में देते हैं और properties को access करते हैं।
External CSS के लिए सबसे पहले एक फाइल बनाते है और उसको save करते हैं style.css नाम से। इसके बाद इसको html code में लिंक करने के लिए <link> tag का use करते हैं।
<link rel="stylesheet" href="styles.css">
इसमें आप कुछ और नाम भी दे सकते हैं पर उसका टाइप .css ही होना चाहिए जैसे style1.css, pagestyle.css आदि, और जो नाम आपने css फाइल को दिया है उसी का use link tag के अन्दर href के बाद करेंगे।
Internal CSS – इसमें css code को html पेज के head section में ही लिखा जाता है। इसके लिए <style> tag का use करते हैं। CSS code को लिखने के लिए <style>css code </style> दोनों opening tag और closing tag का होना जरुरी है।
Inline CSS – CSS के इस तरीके में हम css code को किसी element के starting tag के अन्दर लिखते हैं और इसको लिखने के लिए style attribute का use करते हैं।
Note –1. CSS code लिखने के तीनों तरीकों में किसी element पर सबसे पहले external css का code apply होता है फिर internal css का और सबसे आखिरी में inline css का code apply होता है। अगर कोई element ऐसा है जिसके लिए अपने तीनों जगह css का code लिखा है तो जब वो वेब browser पर display होगा और उस पर inline css का code apply होगा। उदाहरण के लिए अगर आप किसी heading का color, external css में red और internal css में blue और inline css में green color देते हो finally आपकी heading Green color की दिखाई देगी।
2. किसी Parent element के लिए जो css का use करते हैं वो automatically child elements पर भी apply हो जाती है। for Example अगर आप <body> tag के अन्दर font का color red कर देते हैं तो इस tag अन्दर आने वाले सभी tag जैसे heading, paragraph आदि के text का color भी red हो जायेगा अगर आप इन tags का color अलग से define नहीं करते है तब।
Comments