Posts

Showing posts with the label webdeveloper

CSS: Types of Selectors

Image
  what is selectors? CSS selectors allow you to target specific HTML elements. You can select elements by tag name (e.g., h1, p), class (e.g., .container, .button), ID (e.g., #header, #footer), or other attributes. There are several important types of selectors in CSS: 1. Element Selector 2.  ID Selector 3. Class Selector 4. Pseudo-Class Selector 5. Pseudo-Elements Selector 6. Descendant Selector 7. Child Selector 8. Adjacent Selector 9. General Sibling Selector 10. Attribute Selector 1. Element Selector The simplest kind of selection targets HTML components based on their tag name. EX.  index.html <!DOCTYPE html>  <html lang="en">  <head>  <title>My First WebPage</title> <link href="./main.css" rel="stylesheet"></link> </head> <body>     <p>PARA 1</p>     <span>SPAN</span>      <p>PARA 2</p> </body> </html> main.css p {     color: red } Output: Oh no! Fan

CSS: An Easy Introduction to Beginners

Image
W hat is CSS CSS, or Cascading Style Sheets, is a language used to style the appearance of web pages. Imagine a web page without CSS – it would just be plain text. CSS is what makes websites look visually appealing by adding colors, layouts, fonts, and other design elements. Here is the example. The area labeled "HTML ONLY" shows how your website will seem if you use simply HTML, while the portion labeled "HTML WITH CSS" shows how your website will appear if you use HTML along with CSS. Cool right! Syntax of CSS (CSS in External file or Internal) Selector {     Property1: Value     Property2: Value } EX: p {     color: blue;     font-size: 24px; } Syntax of CSS (Inline) <span style="property1: value; property2: value;"></span> EX: <span style=" color: red; font-size: 40px; "></span> what is selectors? CSS selectors allow you to target specific HTML elements. You can select elements by tag name (e.g., h1, p), class (e.g., .