GA FEWD: 1.4 css rules

In this example below you will see how to do a GA FEWD: 1.4 css rules with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by eksong, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright eksong ©
  • HTML
  • CSS
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>GA FEWD: 1.4 css rules</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <span class="outside">
  This will be green.
  <div class="inside">
    Text 1
  </div>
</span>

<span class="outside inside">
  Text 2
</span>
<br><br>
span.inside
= this is 1 selector
= Only select something that is a span, and that has the class "inside"

span .inside
= 2 selector
first sepect all spans, then look for class .inside nested in it. doenst matter the name of the class.
<br>
<ul>
  <li>
    .outside is when you dont care about the name of the class... but want to select all the elements contatining .outside  </li>
    <li>
      div.outside is when you look for something hat is a div, and that has the class .outside </li>
  <li>div .outside -- .outside has to be nested inside a div </li>
  <li>1em=16px </li>
  
  

</body>

</html>

/*Downloaded from https://www.codeseek.co/eksong/ga-fewd-14-css-rules-aAtbp */
span.outside {
  color: green;
}
/* look for spans that have the class outside*/

span .outside {
  color: green;
}
/*look for spans that have the child .outside*/

span.inside {
  color: red;
}
/*look for spans that have the class inside*/

span .inside {
  color: rgba(0, 0, 255, 0.5);
}

/*look for spans that have the child .inside, and if there are two same classes, override the initially defined style for this class*/

Comments