HTML and CSS

HTML

HyperText Markup Language, a declarative language for defining elements in a document for use on the web.

• semantics: relating to meaning. In the context of the web, we emphasize meaning to be a concern separate from

behavior or presentation.

element

an entity defined by HTML

tag

the label used to define an element in HTML

attributes

key="value" pairs defined in a tag that provide additional information about the element

parent

The element directly containing a given element is the given element’s parent

child

A child directly contained by a given element is the given element’s child.

ancestor

Any element “higher” in the hierarchy than a given element is an ancestor of the given element.

descendant

Any element “lower” in the hierarchy than a given element is a descendant of the given element

html tag

the “root” element in an html document. Has no parent in the document

head tag

the tag used to define document meta data

body tag

the tag used to define the document body.

p tag

the tag used to define a paragrapyh

a tag

the tag used to define anchor elements, that is elements who define links.

href attribute

the attribute used on anchor elements to specify the URI the link points at

relative resource locators

a simplified version of a URI which is relative to the current document’s scheme, authority,

path, or self.

img tag

the tag used to define an image element.

src attribute

the attribute used on image, video, and audio to specify the URI of the media file

video tag

the tag used to define a video element

form tag

he tag used to define a form element.

method attribute

when the form is submitted, the value of this attribute is used as the method for the request to the server. Defaults to GET. Only GET and POST are actually supported natively.

action attribute

this attribute is used to specify the URI of the resource that will handle submission of the form.

input tag

a tag used to define form input elements.

name attribute

when a form is submitted, the content is sent to the server as key-value pairs. It defines the key for each input element.

type attribute

specifies the type of an input element.

submit type

an element of type submit is used as a control to actuate submission of the form.

div tag

the generic block element tag

span tag

the generic inline element tag

id attribute

one of the three universal attributes: an identifier for the element; should be unique in the document.

Can be referred to by the fragment part of the URI

class attribute

one of the three universal attributes: should be used to refine the meaning of a tag, often abused to

affect presentation rules

style attribute

one of the three universal attributes: explicitly defines presentation rules on the element. Should be avoided

MDN

Mozilla Developer Network is the resource for documentation about the web platform.

CSS

Cascading Style Sheets is a declarative language used to specify presentation rules of HTML documents

style tag

the tag used to embed CSS into an HTML document

link tag

the tag used to reference a CSS file for use in an HTML document

selector

a pattern that is used to match, or select, an element or elements in an HTML document.

declaration

a property: value; pair that defines a particular presentation rule.

rule set

the combination of a selector or group of selectors and a declaration block that connects presentation rules to

elements in an HTML document.

property

an identifier to specify which presentation feature the declaration concerns.

value

a description of how the presentation feature should be applied.

display

none: a declaration that indicates that the element should not be displayed.

id selector

a selector beginning with an octothorpe that matches elements by the value of their id attribute.

class selector

a selector beginning with a period that matches elements by the value of their class attribute

element selector

a selector matching the tag used on the elements.

descendant combinator

combining multiple selectors with spaces creates a “path” where each subsequent selector is

the descendant of the previous one matched.

media queries

styles can be restricted to being used only when the presenting media matches certain criteria, such as

width, orientation, or screen versus print.

mobile first

an approach to creating presentation rules that starts with the defaults tailored to small screen widths

and then progressively enhancing for larger screens using media queries.

responsive

an approach to creating presentation rules that starts as the maximum expected screen width and using

media queries to adjust presentation rules to accommodate smaller screens

fluid design

an approach to creating presentation rules that leverages modern CSS features that automatically adjust

to the available space on the page.