###HTML Skeleton Consists of the set of tags required for an HTML file.
-- declaration of the type of HTML (e.g. HTML5)< html > --root element of an HTML page < head > contains meta tags of the document. Not visible to user < /head >
< body > where visible content lives. This is viewable to the user/displayed on a browser < /body > < /html > --closes the document
meta information goes between the open/closing tags of the element name head
between the tags represents the content of an HTML document. Only one element can be used in a document.
###Semantic Tags Semantic Tags: elements with meaning. Semantic elements clearly describe the meaning of the element, both to the browser and the programmer. Examples: < form >, < table >, and < article > these define the content they contain.
###Non-Semantic Tags
Non-descriptive elements < div > and < span > - Tells nothing about its content.
###CSS
Cascading Style Sheets: A style sheet language used to describe the presentation of a markup language document. File extension: .css Media type: text/css Used most often to create visual style of web pages/UI written in HTML, CSS can be used in any XML document and can be rendered in speech or other media. CSS is used to enable the separation of document content and document presentation. This allows for the same markup page to be presented in different styles for different rendering methods (web/mobile/print/braille)
###Selectors
Patterns which are used to select element(s) you want to style.
###Class Selectors A type of basic selector which chooses elements based on the value of their class attribute E.g. .classname will match any element that has a class .classname
###ID Selectors Chooses nodes based on the value of its id attribute. There should only be one element with a specific ID in an HTML document
###Box Model
HTML elements can be looked at as boxes. The CSS box model refers to design/layout. Surrounding each HTML element, there is an imaginary box that wraps around the element. The sections include: margin, border, padding, and content (in order from the outside inward). The box model allows us to define space between elements and define borders around elements.
###Display Property
One of CSS's most important property for managing layout. There is a default display value for each type of element. For most elements the defaulty is usually block or inline. A block element is also called a block-level element. Inline elements: called inline elements. A div is the standard block-level element. Span is the standard inline element. None: is another common display value.
###Floats
A CSS positioning property. Specifies that an element should be taken from it's default and placed along either left/right side of the container it is located in. Float can be used to wrap text around images.
###Clearfix
A way for an element to auto clear its child elements. Its usage is generally for float layouts, where clearfix can combat the zero-height container problem for floated elements.
###Detour: Lorem Ipsum
"Lorem ipsum dolor sit amet consectetuer" is just jumbled/nonsense Latin. It does have a long history, and has been used by typographers to show distinctive features of fonts. It became a standard for 'dummy text' in the printing industry, and has been continued to use as dummy/fake text in styling webpages. Developers use lorem ipsum as filler text! There are many lorem ipsum generators online, spanning a wide variety of topics. Cupcake ipsum and bacon ipsum are two fun sites. http://www.cupcakeipsum.com/, https://baconipsum.com/
###Wireframing
An important step in designing the layout of a web page/web application. It's like a blueprint for your site. It allows you to define information in a hierarchy, or a series of priorties in placement. Also, wireframing can be important for the user interface, and organizing calls to action you want the user to process through.
###Pseudo-Classes A keyword that is added after a selector to denote a specific 'state' the element holds. e.g: a:hover will apply a style when the user hovers over the link.