What are the three main ways to add CSS to a webpage?

Experience Level: Junior
Tags: CSS

Answer

  • External style - link
Example
<html>
<head>
	<title>External style for CSS</title>
	<link rel="stylesheet" type="text/css" href="html-cheat-sheet.css" />
</head>
<body>
	<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</body>
</html>
  • In-line style - atribut
Example
<html>
<head>
	<title>In-line style for CSS</title>
</head>
<body>
	<p style="color: red">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</body>
</html>
  • Embedded style
Example
<html>
<head>
	<title>Embedded style for CSS</title>
	<style>
		p  {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		color: #ff9900;
		}
	</style>
</head>
<body>
	<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</body>
</html>
Related CSS job interview questions
CSS for beginners
CSS for beginners

Are you learning CSS? Try our test we designed to help you progress faster.

Test yourself