title: How to change the background color of the outermost <body> tag with Angular
body: <p>I want to change the Background color of my AngularApp programmatically. The problem here is, that changing the background inside the app, applies only to some part of the screen. Probably only what is already filled with content. I want the whole site to change the color.</p>
  
  <p>I'm working with the seed that is provided by angular.io. The index.html looks like this:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;base href="/"&gt;
          &lt;title&gt;Angular QuickStart&lt;/title&gt;
          &lt;meta charset="UTF-8"&gt;
          &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
          &lt;link rel="stylesheet" href="styles.css"&gt;
          &lt;!-- Polyfill(s) for older browsers --&gt;
          &lt;script src="node_modules/core-js/client/shim.min.js"&gt;&lt;/script&gt;
          &lt;script src="node_modules/zone.js/dist/zone.js"&gt;&lt;/script&gt;
          &lt;script src="node_modules/systemjs/dist/system.src.js"&gt;&lt;/script&gt;
          &lt;script src="systemjs.config.js"&gt;&lt;/script&gt;
          &lt;script&gt;
              System.import('app').catch(function (err) { console.error(err); });
          &lt;/script&gt;
      &lt;/head&gt;
    &lt;body&gt;
      &lt;my-app&gt;Loading AppComponent content here ...&lt;/my-app&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Is there a way to manipulate the class of the outermost "body" from the AngularApp?</p>
  
  <p>I can change everything that is within the "my-app" - Tag. Is there either a way to setup the index.html in a way that the first "body" tag is in my control?</p>
  
  <p>If not, is there another way to get control of the outer "body" tag?</p>
  
  <p>Thanks in advance!</p>
  
  <p>BR Mathias</p>