HTML Styles Basics
HTML styles allow you to change the appearance of your HTML elements, such as the text color, background color, font style, and more. There are several ways to apply styles to your HTML document, including inline styles, internal styles, and external styles.
1. Inline Styles:
Inline styles are applied directly to the HTML element using the style attribute. Here's an example:
css Copy code;
<p style="color: red; font-size: 20px;">This text is red and has a font size of 20px</p>
2. Internal Styles:
Internal styles are defined within the <head> section of the HTML document using the <style> tag. Here's an example:
php Copy code;
<head>
<style>
p {
color: red;
font-size: 20px;
}
</style>
</head>
<body>
<p>This text is red and has a font size of 20px</p>
</body>
3. External Styles:
External styles are defined in a separate CSS file and then linked to the HTML document using the <link> tag. Here's an example:
In a separate file named style.css:
css Copy code;
p {
color: red;
font-size: 20px;
}
In the HTML file:
php Copy code;
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>This text is red and has a font size of 20px</p>
</body>
These are just some basic examples of how to apply styles to HTML elements. There are many other style properties you can use to customize the appearance of your HTML elements.
0 Comments