Introduction In CSS
Introduction In CSS
CSS stands for Cascading Style Sheets. It is a style sheet language used to describe the presentation of HTML (Hypertext Markup Language) documents. CSS allows developers to separate the presentation of a document from its content, making it easier to maintain and modify the design of a website.
Here are some basic concepts of CSS:
- Selectors: Selectors are used to target specific HTML elements and apply styles to them. There are many different types of selectors, such as element selectors, class selectors, ID selectors, and attribute selectors.
- Properties: Properties are used to define the style of an element, such as its color, font, size, and positioning. CSS has a wide range of properties that can be applied to different elements.
- Values: Values are used to set the style of an element for a specific property. For example, the color property can be set to a specific color value, such as “red” or “#ff0000”.
- Declarations: Declarations are made up of a property and a value, separated by a colon. Multiple declarations can be combined into a rule set, which is applied to one or more selectors.
- Box Model: The box model is a fundamental concept in CSS that describes the layout of HTML elements. Every element on a web page is a rectangular box, consisting of content, padding, borders, and margins.
- Cascading: The term “cascading” in CSS refers to the way styles are applied to elements. When there are conflicting styles applied to an element, the browser will use a set of rules to determine which style takes precedence.
CSS can be applied to HTML documents in several ways, including:
Inline Styles: Styles can be applied directly to HTML elements using the “style” attribute. For example:
<h1 style="color: red;">Hello World</h1>
- Internal Styles: Styles can be added to the head of an HTML document using the <style> tag. For example:
<head>
<style>
h1 {
color: red;
}
</style>
</head>
External Styles: Styles can be stored in an external CSS file and linked to the HTML document using the <link> tag. For example:
<head>
<link rel="stylesheet" href="style.css">
</head>
CSS is a powerful tool for web development and can be used to create beautiful and engaging web pages. By understanding the basic concepts of CSS, you can begin to experiment with different styles and layouts to create unique and appealing designs.
CSS (Cascading Style Sheets) का अर्थ होता है “कास्केडिंग स्टाइल शीट्स”। यह एक स्टाइल शीट भाषा है जिसका उपयोग HTML (हाइपरटेक्स्ट मार्कअप भाषा) दस्तावेज़ों के प्रस्तुति को विवरणित करने के लिए किया जाता है। CSS डेवेलपर्स को दस्तावेज़ की डिज़ाइन को संभालने और संशोधित करने को सरल बनाता है, क्योंकि यह विषय और डिज़ाइन को अलग करता है।
यहां कुछ CSS के मौलिक अवधारणाएँ हैं:
1. **सेलेक्टर (Selectors):** सेलेक्टर का उपयोग किए जाते हैं ताकि विशिष्ट HTML तत्वों को चुना जा सके और उन पर स्टाइल लागू की जा सके। एलिमेंट सेलेक्टर्स, क्लास सेलेक्टर्स, आईडी सेलेक्टर्स, और एट्रिब्यूट सेलेक्टर्स जैसे कई प्रकार के सेलेक्टर्स होते हैं।
2. **प्रॉपर्टीज़ (Properties):** प्रॉपर्टीज़ का उपयोग तत्व के शैली को परिभाषित करने के लिए किया जाता है, जैसे कि इसका रंग, फॉन्ट, आकार, और स्थानन। CSS में इसमें कई प्रॉपर्टीज़ होती हैं जो विभिन्न तत्वों पर लागू की जा सकती हैं।
3. **वैल्यूज़ (Values):** वैल्यूज़ का उपयोग किसी विशिष्ट प्रॉपर्टी के लिए तत्व की शैली को सेट करने के लिए किया जाता है, जैसे कि रंग प्रॉपर्टी को “लाल” या “#ff0000” जैसे विशिष्ट रंग वैल्यूज़ से सेट किया जा सकता है।
4. **डिक्लेरेशन्स (Declarations):** डिक्लेरेशन्स में एक प्रॉपर्टी और एक वैल्यू होती है, जो एक रूल सेट बनाने के लिए एक सेलेक्टर पर लागू की जा सकती हैं। एक सेलेक्टर पर एक से अधिक डिक्लेरेशन को मिला कर एक रूल सेट बनाई जा सकती है।
5. **बॉक्स मॉडल (Box Model):** बॉक्स मॉडल CSS में एक मौलिक अवधारणा है जो HTML तत्वों के लेआउट को विवरणित करती है। एक वेब पृष्ठ पर हर तत्व एक आयताकार बॉक्स होता है, जिसमें सामग्री, पैडिंग, बॉर्डर, और मार्जिन्स शामिल होते हैं।
6. **कास्केडिंग (Cascading):** CSS में “कास्केडिंग” शब्द का अर्थ है तत्वों पर स्टाइल लागू करने के तरीके को। जब किसी तत्व पर संघटित स्टाइल होती है, तो ब्राउज़र उस