Notes

CSS:
If some properties have been defined for the same selector (element) in different style sheets, the value from the last read style sheet will be used.

Cascading Order:
1.Inline style (inside an HTML element)
2.Internal stylesheet
3.External stylesheet
4.Browser default

If the internal is defined after the external style sheet(link) the internal will override. If the internal is defined before external(link) the external will override.

1. Id such as #navbar (An ID selector will only take precedence over a Class selector if they are both used in the same element.)
2. Class such as .header
3. Element such as p, h1, div, etc..

!important can be overwritten if the conflict is not in the same element.
#testid {
color: red !important;
font-weight: bold;
}
.testclass {
color: blue;
font-family: arial;
}
Here !important will be overwritten by the color: blue in the .testclass if the element are placed like this:
<div id="testid">
<span class="testclass">
The Bears will go 16-0 this season. <== this will be blue!
</span>
</div>

Box model:
1. Content
2. Padding
3. Border
4. Margin

div p { ceva... } - Selecteaza toate elementele p din div
div > p { ceva... } - Selecteaza toate elementele p care sunt copii lui div ( <div><p asta da></p><section><p asta nu></p> )</section> )
div + p {ceva...} - Selecteaza elementul p care este imediat dupa un div ( <div></div><p asta da></p><p asta nu></p> )
div ~ p {ceva...} - Selectaza toate elementele p care sunt dupa div ( <div></div><p asta da></p><p asta da></p> )

a:hover MUST come after a:link and a:visited
a:active MUST come after a:hover ==> a:link, a:visited, a:hover, a:active

a[target] {
background-color: yellow;
} - Face toate elementele a cu target sa fie selectate

a[target="_blank"] {
background-color: yellow;
} - Face toate elementele a cu target _blank sa fie selectate

[title~="flower"] {
border: 5px solid yellow;
} - Face toate elementele care au title="flower" sa fie selectate

[class|="top"] {
background: yellow;
} - Face toate elementele care au la inceputul clasei cuvantul top(ex: class="top-title") sa fie selectate

[class^="top"] {
background: yellow;
} - Face toate elementele care au la inceputul clasei cuvantul top (ex: class="top-title" sau "toptitle" sau "toppulameaceofi") sa fie selectate

[class$="test"] {
background: yellow;
} - Face toate elementele care au la sfarsitul clasei cuvantul test(ex: class="pulatest" sau "pula-test") sa fie selectate

[class*="te"] {
background: yellow;
} - Face toate elementele care au in continutul numelui clasei cuvantul "te"(ex: class="pulatest" sau "pula-test") sa fie selectate

ID selectors have a higher specificity than attribute selectors - div#a { ceva...} este mai specific decat div[id=a] {ceva...}

background-position : pozitia imaginii background
background-repeat : no-repeat, repeat-x, repeat-y
z-index: poate avea valori pozitive sau negative si dicteaza ordinea de afisare a elementelor unul peste celalalt

HTML:
Tags that don't need closing - img, input, br, meta
Formating tags: b, i, sup, sub, strong, em
New form elements in HTML5 - Email, Search, Date, Number, Time
HTML5 new tags - HEader, Footer, Article, Section, Nav

JS:
Is a dynamic language (variables can change their type at runtime).
The typeof a undefined variable is undefined. Ex: let name = undefined => typeof undefined.
The typeof a null variable is object. Ex: let name = null=> typeof object.

== checks value only. === checks value and type;

Primitive types: String, Number, Boolean, Symbol, undefined, null;
Reference types: Object, Array, Function;

NaN - not a number; isNaN() - functie care iti arata daca variabila este numar sau nu. Daca nu este, returneaza NaN.
Variabila e undefined daca e declarata si neinitializata. Null se poate asigna doar.

Events - onclick, onmouseover, onkeydown, onmouseout, onhange, onload, onblur, onsubmit, oncopy, onpaste


String methods:
toUpperCase():
toLowerCase();

concat() joins two or more strings:
var text1 = "Hello";
var text2 = "World";
var text3 = text1.concat(" ", text2);

The txt.length property returns the length of a string:
var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length; ==> output: 26

The indexOf() method returns the position of the first occurrence of a specified text in a string:
var str = "Please locate where 'locate' occurs!";
var pos = str.indexOf("locate"); ==> output: 7

The lastIndexOf() method returns the index of the last occurrence of a specified text in a string:
var str = "Please locate where 'locate' occurs!";
var pos = str.lastIndexOf("locate"); ==> output: 21

.slice(start, end) ==> takes 2 parameters: the start position, and the end position (end not included).
.substring(start, end) ==> substring() cannot accept negative indexes.
.substr(start, length) ==> the difference is that the second parameter specifies the length of the extracted part.

The replace() method replaces a specified value with another value in a string:
str = "Please visit Microsoft!";
var n = str.replace("Microsoft", "W3Schools");

The trim() method removes whitespace from both sides of a string:

var txt = "a,b,c,d,e"; // String
txt.split(","); // Split on commas
txt.split(" "); // Split on spaces
txt.split("|"); // Split on pipe

Number methods:
The toString() method returns a number as a string.
toFixed() returns a string, with the number written with a specified number of decimals:
var x = 9.656;
x.toFixed(0); // returns 10
x.toFixed(2); // returns 9.66
x.toFixed(4); // returns 9.6560

Array methods:
var x = cars.length; cars is an array // The length property returns the number of elements
var y = cars.sort(); // The sort() method sorts arrays
fruits.push("Lemon"); // adds a new element (Lemon) to fruits array
toString()

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop(); // Removes the last element ("Mango") from fruits
fruits.shift(); // Removes the first element "Banana" from fruits
fruits.unshift("Lemon"); // Adds a new element "Lemon" to fruits
fruits.sort(); // Sorts the elements of fruits
fruits.reverse(); // Then reverse the order of the elements

function func(x){
console.log(typeof x, arguments.length); ==> arguments se refera la argumentele din functie.
}
func(); //==> "undefined", 0
func(7); //==> "number", 7
func("1", "2", "3"); //==> "string", 3