Inline Styles

Directly apply styles to an element using the style attribute:

<p style="color: red;">This text is red.</p>

Internal Stylesheet

Define styles within the <head> section of your document:

<style>
body {
    background-color: lightblue;
}
p {
    color: navy;
}
</style>

External Stylesheet

Link to an external CSS file for your styles:

<link rel="stylesheet" href="styles.css">

Styling Text

Styles can control various aspects of text appearance:

p {
    font-family: "Arial", sans-serif;
    font-size: 16px;
    color: darkgray;
    text-align: center;
}

Box Model

All HTML elements can be considered as boxes, and CSS controls their box model properties:

div {
    width: 300px;
    padding: 25px;
    border: 2px solid gray;
    margin: 10px;
}