<head>
<style>
h1 {
color: blue;
font-size: 14px;
}
</style>
</head>
Inline styles are used to apply a style directly to an element within the HTML tag itself. This approach makes use of the style attribute of HTML tags to apply the style direct. While this approach is the fastest in terms of time taken to render the style, as no ‘lookup’ is required (no need for a selector), using this method and mixing HTML with CSS can mean that your webpage becomes confusing to code and analyse. You also lose the advantage of reusable styles and the simplicity of a single codebase for your CSS.
Let’s see how this approach works in practice: