# - id selector, example:

HTML:

<!DOCTYPE html>
<html>

	<head>
		<link rel="stylesheet" type="text/css" href="/index.css">
	</head>
	
	<body>
	<h2 id="featured">featured</h2>
	test
	</body>
	
</html>

CSS (index.css):

h2#featured {
	color: red;
}

Notice line <h2 id="featured">featured</h2>

element selector, example:

HTML:

<!DOCTYPE html>
<html>

	<head>
		<link rel="stylesheet" type="text/css" href="/index.css">
	</head>
	
	<body>
	<h2>featured</h2>
	test
	</body>
	
</html>

CSS:

h2 {
	color: red;
}

Notice now that I deleted ID from line <h2>featured</h2> and css is without hash sign.

. -class selector, example:

HTML:

<!DOCTYPE html>
<html>

	<head>
		<link rel="stylesheet" type="text/css" href="/index.css">
	</head>
	
	<body>
	<h2 class="myClass">featured</h2>
	test
	</body>
	
</html>

CSS:

.myClass {
	color: red;
}

Notice now how I wrote line <h2 class="myClass">featured</h2>

Rest of CSS selectors you can find here.

If we write something like:

<span style="font-style: normal; font-style: italic;">Css test</span>

Then font will be italic, but if we write something like:

<span style="font-style: italic; font-style: normal;">Css test</span>

Then font will be "normal".

Use something like:

 

z-index: 9999;

To display div (or span) content on right side, use something like:

 
  <div style="float: right">
	YO! This is a test!
  </div>