<pclass="legacydocsnote">This documentation is for an outdated version of Video.js. See <ahref="https://docs.videojs.com/tutorial-skins.html">documentation for the current release</a>.
<p>The base Video.js skin is made using HTML and CSS (although we use the <ahref="http://sass-lang.com">Sass preprocessor</a>),
and by default these styles are added to the DOM for you!
That means you can build a custom skin by simply taking advantage of the cascading aspect of CSS and overriding
the styles you'd like to change.</p>
<p>If you don't want Video.js to inject the base styles for you, you can disable it by setting <code>window.VIDEOJS_NO_BASE_THEME = true</code> before Video.js is loaded.
Keep in mind that without these base styles enabled, you'll need to manually include them.</p>
<p>Video.js does not currently include the base skin automatically yet, so, this option isn't necessary.</p>
<p>Video.js uses a couple of style elements dynamically, specifically, there's a default styles element as well as a player dimensions style element.
They are used to provide extra default flexiblity with styling the player. However, in some cases, like if a user has the HEAD tag managed by React, users do not want this.
When <code>window.VIDEOJS_NO_DYNAMIC_STYLE</code> is set to <code>true</code>, video.js will <em>not</em> include these element in the page.
This means that default dimensions and configured player dimensions will <em>not</em> be applied.
For example, the following player will end up having a width and height of 0 when initialized if <code>window.VIDEOJS_NO_DYNAMIC_STYLE === true</code>:</p>