Introduction to CSS

-

Introduction to CSS:

CSS (Cascading Style Sheets) is a language designed to simplify the process of making web pages presentable.

• It allows you to apply styles to HTML documents by prescribing colors, fonts, spacing, and positioning.

• The main advantages are the separation of content (in HTML) and styling (in CSS) and the same CSS rules can be used across all pages and not have to be rewritten.

• HTML uses tags and CSS uses rule sets.

• CSS styles are applied to the HTML element using selectors.

Need for CSS:

• Saves Time: Write CSS once and reuse it across multiple HTML pages.

• Easy Maintenance: Change the style globally with a single modification.

• Search Engine Friendly: Clean coding technique that improves readability for search engines.

• Superior Styles: Offers a wider array of attributes compared to HTML.

• Offline Browsing: CSS can store web applications locally using offline cache, allowing offline viewing.

CSS Syntax:

CSS consists of style rules that are interpreted by the browser and applied to the corresponding elements. A style rule set includes a selector and a declaration block.

• Selector: Targets specific HTML elements to apply styles.

• Declaration: Combination of a property and its corresponding value.

Example:

// HTML Element

<h1>Hello</h2>

// CSS Style

h1 { 

color: blue; 

font-size: 12px; 

}

Where -

Selector - h1

Declaration - { color: blue; font-size: 12px; } 

• The selector points to the HTML element that you want to style.

• The declaration block contains one or more declarations separated by semicolons.

• Each declaration includes a CSS property name and a value, separated by a colon.

Ways to Apply CSS in HTML:

1. Inline CSS:

Inline CSS allows you to apply styles directly within HTML tags using the style attribute.
Example:
<html>
<head>
</head>
<body>
<p style=”color:Red;”>This is inline CSS.</p>
</body>
</html>

2. Internal CSS:

Internal CSS involves adding CSS styles directly within the HTML file by including them inside the <style> tags.
Example:
<html>
<head>
<style>
P{
Color:Red;
}
</style>
</head>
<body>
<p>This is internal CSS.</p>
</body>
</html>

3. External CSS:

External CSS involves creating a separate CSS file with a .css extension and linking it to the HTML file using the <link> tag.
<html>
<head>
<link rel=”stylesheet” href=”style.css”/>
</head>
<body>
<p>This is external CSS.</p>
</body>
</html>

Style.css:

p{
Color:Red;
}

Comments

Post a Comment

Popular posts from this blog

Artificial Intelligence in Education

-
 The Transformative Power of Artificial Intelligence in Education Artificial Intelligence (AI) is revolutionizing the education sector, offering opportunities for personalized learning, enhanced student engagement, and improved administrative efficiency. As AI continues to evolve, it's essential to explore its applications, benefits, and future prospects in education. One of the most significant advantages of AI in education is its ability to provide personalized learning experiences. By analyzing student data, AI can tailor educational content to individual strengths, weaknesses, and learning styles. This approach encourage a more inclusive educational environment, where students can learn at their own pace and focus on areas that need improvement. AI-powered intelligent tutoring systems offer real-time feedback and support, enhancing the learning process and nurturing critical thinking and problem-solving skills. These systems can provide individualized attention to students, hel...
Read more

Puran Poli – The Sweet Soul of Maharashtrian Tradition

-
Image
  Puran Poli – The Sweet Soul of Maharashtrian Tradition When it comes to traditional Indian sweets that carry both flavor and emotion, Puran Poli holds a special place. Popular in Maharashtra and several parts of South India, this soft, sweet flatbread is more than just a festive dish—it is a symbol of celebration, warmth, and family traditions passed down through generations. What is Puran Poli? Puran Poli is a delicious stuffed flatbread made with a sweet filling called puran . The filling is typically prepared using cooked chana dal (split Bengal gram) mixed with jaggery , flavored with cardamom and sometimes nutmeg . This sweet mixture is stuffed inside a thin wheat flour dough and roasted on a hot griddle with ghee until golden and aromatic. The result is a soft, slightly crispy, melt-in-the-mouth treat that perfectly balances sweetness and richness. A Dish Rooted in Culture In Maharashtra, Puran Poli is strongly associated with festivals and special occasions. It is tradi...
Read more

Future of AIML Engineering

-
Image
  The Future of AI/ML Engineering: Transforming Industries and Shaping Tomorrow Artificial Intelligence (AI) and Machine Learning (ML) are changing the world faster than we imagined. These technologies are now everywhere—healthcare, finance, retail, and even agriculture. For AI/ML engineers, this growth opens new doors and big opportunities. They’re the people building the tools that make machines smarter and solve complex problems. This article explores what’s next for AI/ML engineering. We'll look at some key trends, career paths, new tech, ethical issues, and real-world examples that show the power of AI. The Current State of AI/ML Engineering Overview of AI/ML Technologies in 2023 In 2023, AI and ML keep breaking new ground. Deep learning algorithms help computers recognize images and speech better than ever. Natural language processing (NLP) now powers chatbots and voice assistants that sound more human. Computer vision is improving so much that driverless cars can see and...
Read more