CSS - Style Sheet (Script|File) - Stylesheet

1 - About

A set of statements that specify presentation of a source document.

3 - Properties

3.1 - Source

Style sheets may have three different origins:

  • author,
  • user,
  • and user agent.

The priority of these sources is governed by this mechanisms:

4 - Management

4.1 - Valid

A valid style sheet must be written according to the grammar

4.2 - Content type

CSS style sheets that exist in separate files are sent over the Internet as a sequence of bytes accompanied by encoding information. The structure of the transmission, termed a message entity, is defined by RFC 2045 and RFC 2616.

A message entity with a content type of “text/css” represents an independent CSS document. The “text/css” content type has been registered by RFC 2318.

4.3 - Declaration / Loading

HTML - The link element (inter-document relationships)


<head>
   <link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

4.3.2 - Style (Inline)

Inline with the style node


<style>
@import url("css/style.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/themes/prism.min.css");
</style>

More see CSS - Style declaration (Inline - (External|Internal) Style sheet)

4.3.3 - Javascript

We are creating link element programatically.


const head = document.querySelector('head');
const baseCdn = "https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/";
const stylesheets = [
	["themes/prism-tomorrow.min.css", "sha512-vswe+cgvic/XBoF1OcM/TeJ2FW0OofqAVdCZiEYkd6dwGXthvkSFWOoGGJgS2CW70VK5dQM5Oh+7ne47s74VTg=="],
	["plugins/toolbar/prism-toolbar.min.css","sha512-DSAA0ziYwggOJ3QyWFZhIaU8bSwQLyfnyIrmShRLBdJMtiYKT7Ju35ujBCZ6ApK3HURt34p2xNo+KX9ebQNEPQ=="],
	/*https://prismjs.com/plugins/command-line/*/
	["plugins/command-line/prism-command-line.min.css","sha512-4Y1uID1tEWeqDdbb7452znwjRVwseCy9kK9BNA7Sv4PlMroQzYRznkoWTfRURSADM/SbfZSbv/iW5sNpzSbsYg=="],
	/*https://prismjs.com/plugins/line-numbers/*/
	["plugins/line-numbers/prism-line-numbers.min.css","sha512-cbQXwDFK7lj2Fqfkuxbo5iD1dSbLlJGXGpfTDqbggqjHJeyzx88I3rfwjS38WJag/ihH7lzuGlGHpDBymLirZQ=="]
];
stylesheets.forEach(stylesheet => {
		let link = document.createElement('link');
		link.rel="stylesheet"
		link.href=baseCdn+stylesheet[0];
		link.integrity=stylesheet[1];
		link.crossOrigin="anonymous";
		head.append(link);
	}
)


Data Science
Data Analysis
Statistics
Data Science
Linear Algebra Mathematics
Trigonometry

Powered by ComboStrap