CSS properties and values

CSS (Cascading Style Sheets) is a stylesheet language used to control the presentation and layout of HTML documents. It allows you to style the elements of a webpage, such as fonts, colors, margins, and more. Here is a list of some commonly used CSS properties and their corresponding values:

1. color: Defines the text color.
   • Values: Named colors (e.g., “red”, “blue”), hexadecimal (e.g., “#FF0000”), RGB (e.g., “rgb(255, 0, 0)”), RGBA (e.g., “rgba(255, 0, 0, 0.5)”).
2. background-color: Sets the background color of an element.
   • Values: Same as the color property.
3. font-family: Specifies the font used for text.
   • Values: Font names (e.g., “Arial”, “Helvetica”), generic families (e.g., “sans-serif”, “serif”).
4. font-size: Defines the size of the font.
   • Values: Pixels (e.g., “16px”), em (relative to the parent element’s font size), rem (relative to the root font size).
5. font-weight: Sets the boldness of the font.
   • Values: “normal”, “bold”, “bolder”, “lighter”, numeric values (e.g., “400”, “700”).
6. text-align: Aligns the text within an element.
   • Values: “left”, “right”, “center”, “justify”.
7. margin: Defines the space around an element.
   • Values: Pixels (e.g., “10px”), percentages (e.g., “5%”).
8. padding: Sets the space between the content and the border of an element.
   • Values: Same as margin.
9. border: Creates a border around an element.
   • Values: Border width (e.g., “1px”), border style (e.g., “solid”, “dotted”), border color.
10. display: Specifies how an element should be displayed.
    • Values: “block”, “inline”, “inline-block”, “flex”, “grid”, “none”, and more.
11. width: Sets the width of an element.
    • Values: Pixels (e.g., “300px”), percentages (e.g., “50%”), “auto”.
12. height: Defines the height of an element.
    • Values: Same as width.
13. position: Sets the positioning method for an element.
    • Values: “static”, “relative”, “absolute”, “fixed”, “sticky”.
14. float: Specifies whether an element should float to the left or right of its container.
    • Values: “left”, “right”, “none”.
15. opacity: Sets the transparency level of an element.
    • Values: A number from 0 (completely transparent) to 1 (fully opaque).
16. box-shadow: Creates a shadow effect around an element’s box.
    • Values: Horizontal offset, vertical offset, blur radius, spread radius, color.
17. text-decoration: Adds visual effects to text, like underline or strikethrough.
    • Values: “none”, “underline”, “overline”, “line-through”.
18. transition: Defines the property to be animated and the duration of the transition.
    • Values: Property name (e.g., “background-color”), duration (e.g., “1s”), timing function (e.g., “ease-in-out”).

These are just a few of the many CSS properties and values available. CSS is a powerful tool for web development, allowing developers to create visually appealing and responsive web pages.