Example 1
Code: Select all
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Using Inline Styles in HTML</title>
</head>
<body>
<h1 style="color:red;font-size:30px;">This is a heading</h1>
<p style="color:green;font-size:18px;">This is a paragraph.</p>
<div style="color:green; font-size:18px;">This is some text.</div>
</body>
</html>Example 2
Code: Select all
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Using Embedded Style Sheet in HTML</title>
<style type="text/css">
body { background-color: YellowGreen; }
h1 { color: blue; }
p { color: red; }
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>Example 3
Code: Select all
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Linking External Style Sheet in HTML</title>
<link rel="stylesheet" href="/examples/css/style.css">
</head>
<body>
<h1>Linking External Style Sheet</h1>
<p>The styles of this HTML document are defined in linked style sheet.</p>
</body>
</html>