Menu

Related Topics

HTML CSS JavaScript PHP Node.js React.js C C++ Go Rust Swift Python Java Excel MS Word PowerPoint
Search

Introduction to XHTML in Hindi

Introduction to CSS

CSS का पूरा नाम Cascading Style Sheets होता है। यह एक stylesheet language है जिसका use HTML elements को design और style देने के लिए किया जाता है।

HTML किसी web page का structure बनाता है, लेकिन उसे सुंदर और आकर्षक दिखाने का काम CSS करता है। CSS से हम colors, fonts, layouts और spacing जैसी चीजें control कर सकते हैं। CSS के बिना web pages बिल्कुल plain और basic दिखते हैं। जब हम CSS apply करते हैं, तो वही page professional, user-friendly और visually appealing बन जाता है।

CSS को तीन तरीकों से use किया जा सकता है: Inline, Internal, और External। Inline CSS सीधे HTML element के अंदर लिखा जाता है। Internal CSS <style> tag में होता है, और External CSS अलग .css file में लिखा जाता है जिसे HTML में link किया जाता है। CSS के अंदर कई तरह की properties होती हैं जैसे color, font-size, background-color, margin, padding, आदि। हर property किसी न किसी visual aspect को control करती है।

CSS responsive design में भी बहुत important होता है। Media queries की मदद से हम यह decide कर सकते हैं कि website अलग-अलग devices पर कैसे दिखेगी — जैसे मोबाइल, टैबलेट या लैपटॉप।

CSS को HTML के साथ use करना बहुत जरूरी है, क्योंकि बिना CSS के कोई भी modern website पूरी नहीं मानी जाती। यह web designing की backbone मानी जाती है।

Benefits of CSS

CSS की मदद से हम किसी भी web page को visually सुंदर और attractive बना सकते हैं। यह HTML structure को एक बेहतर look देता है जिससे users को page समझने और इस्तेमाल करने में आसानी होती है।

CSS से हम पूरे website का design एक ही जगह से control कर सकते हैं। अगर external CSS file use हो रही है, तो सिर्फ एक file edit करने से पूरी website का layout change हो जाता है।

CSS से page loading speed भी बेहतर होती है क्योंकि बार-बार styling code लिखने की जरूरत नहीं होती। एक बार style define करने के बाद हम उसे बार-बार reuse कर सकते हैं।

HTML और CSS को अलग रखने से website का maintenance आसान हो जाता है। Designer केवल CSS को update करके design change कर सकता है, बिना HTML को छुए।

CSS responsive design बनाने में बहुत helpful है। Media queries की मदद से हम website को mobile, tablet और desktop जैसे अलग-अलग devices के लिए automatically adjust कर सकते हैं

CSS animations और transitions से website को interactive और modern look मिलती है। इससे user experience बेहतर होता है और visitor ज़्यादा समय वेबसाइट पर रुकता है।

CSS flexibility देता है। आप color, size, spacing, fonts, layout, और alignment जैसे सभी visual elements को अपने हिसाब से customize कर सकते हैं।

एक consistent design structure बनाने में CSS बहुत मदद करता है। इससे पूरी website पर एक जैसा look और feel आता है, जो professional impression छोड़ता है।

Types of CSS

1. Inline CSS

Inline CSS तब use किया जाता है जब CSS को directly किसी HTML element के अंदर लिखा जाता है। इसमें style attribute का use होता है। यह सबसे ज़्यादा priority वाला CSS होता है लेकिन maintain करना थोड़ा मुश्किल होता है। Example:

HTML

2. Internal CSS

Internal CSS तब use किया जाता है जब CSS code HTML file के <head> section के अंदर <style> tag में लिखा जाता है। यह method तब काम आता है जब styling सिर्फ एक ही page पर चाहिए। Example:

HTML

3. External CSS

External CSS सबसे ज्यादा use किया जाता है। इसमें CSS code एक अलग .css file में लिखा जाता है और HTML file में <link> tag के जरिए जोड़ा जाता है। यह method बड़ी websites के लिए best होता है क्योंकि एक ही CSS file से कई pages को style किया जा सकता है। Example (HTML में link करना):

HTML
CSS

तीनों types के अपने-अपने फायदे हैं। छोटे changes के लिए inline, single page के लिए internal और पूरे site design के लिए external CSS सबसे अच्छा तरीका होता है। Professional websites में आमतौर पर external CSS को ही prefer किया जाता है।


Code copied!

Page Views
0
Visit ID
Not tracked yet
Visit Time
-
Time on Page
0 seconds

Request


Leave a Comment


INITIALIZING...


INITIALIZING...


Quizzes in Hindi

GK Online Quiz in Hindi 10 pages
HTML Online Quiz in Hindi 10 pages
CSS Online Quiz in Hindi 10 pages
JavaScript Online Quiz in Hindi 10 pages
CCC Online Quiz in Hindi 10 pages
History Online Quiz in Hindi 10 pages



Comments Total: 0 comments

📰 Latest Articles

Total: 0 Articles

Featured Products

0 Products 0 Loaded 0 Remaining

All Products Loaded!

You've reached the end of our collection.

Contact Us Form