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;
}