css

CSS Overview

CSS (Cascading StyleSheets) is used to style a page.


Things like color, formatting, positioning, font, size, are all determined by CSS. CSS is used to modify HTML by targeting certain tags.


Tags are selected by using the tag type, or more commonly, the attributes. See this example:


index.html:

<html>
  <head>
    <title>CSS Overview</title>
    <link rel="stylesheet" type="text/css" href="styles.css">
  </head>
  <body>
    <h1>Hello, world!</h1>
    <p>This is my HTML page.</p>
    <div id="unique_div_id">This div has a unique ID, making it easy for CSS to target it</div>
  </body>
</html>


In the above example, we can select the div by its ID, then do something to it.


style.css:

#unique_div_id {
  background: red;
  color: white;
}


This makes the background red, and the text color white;


We could apply that same CSS to the body instead of the file, then the entire page would have those properties:


style.css:

body {
  background: red;
  color: white;
}