html scss code example

Example 1: adding css to html

<head>
  <!-- Linking external Css document -->
  <link rel="stylesheet" href="styles.css">
  
  <!-- Writing Css inside HTML element -->
  <style>
    ...
  </style>
</head>

Example 2: how to use scss in html

/* Answer to: "how to use scss in html" */

/*
  Unfortunately, you can't directly insert an SCSS (Sassy CSS) file
  into your HTML. That's because SASS is a superset (or so-called
  preprocessor or extension) of CSS3's syntax, which is NOT
  supported by web browsers.

  To take full advantage of all the incredible features offered by
  SCSS in your HTML page, you’ll first have to compile it down
  to CSS.

  For more information, check out the answers in:
  https://www.quora.com/How-do-I-insert-an-SCSS-file-into-HTML
*/

Example 3: how to use css

<link rel="stylesheet" href="stylesheet.css">
<div class="mydiv"></div>
<style>
.mydiv {
background-color: /*Color*/;
color: /*Another color*/;
}
</style>

Example 4: Sass Tutorial

/* Define standard variables and values for website */
$bgcolor: lightblue;
$textcolor: darkblue;
$fontsize: 18px;

/* Use the variables */
body {
  background-color: $bgcolor;
  color: $textcolor;
  font-size: $fontsize;
}

Tags:

Misc Example

Recent Posts