HTML Elements (partial list for Final Exam) / NOTE: the character | is used to separate options for an element

Global
applies to all HTML elements
Attributes
id="id" unique identifier
title="title" information that is displayed in some browsers when mouse pointer is over element
lang="keyword" primary language (from standard abbreviations)
dir="ltr | rtl | auto" direction of text; ltr - left to right; rtl - right to left;
class="class" one or more classes for the element (separated by spaces)
style="style" one or more CSS name-value pairs that apply only to current element
a anchor element ... link to another Web pag or resource
href="filename | url" address of Web page or other resource that opens with link is activated
target="name | _blank |
window or tab where resource opens (_blank - new window)
_self"
other attributes ... rel, media, type
audio inserts an audio clip
autoplay="autoplay |
audio begins playing when page is loaded (without user intervention)
none"
controls="controls |
requests that the browser display its default playback controls
none"
height="#"... width="#" height and width of element (in pixels)
loop="loop | none" restart playback each time it reaches the end of the clip
src="path/filename" path and filename to the audio clip
type="MIME;
specifies the container format and codecs used to encode the file
codecs='codecs'"
other attributes audio, preload
br inserts a line break
col encloses one or more table columns to treat as a unit
span="#" number of columns to include
fieldset used to group related controls on a form; used in conjunction with <legend> tag
form marks all the elements that are part of a form; must include a name and a method (GET or POST)
input denotes an item of data that users can enter
Types: button, checkbox, color, date, month, week, time, datetime, email, file, image,
type="input type"
number, password, radio, range, reset, search, submit, tel, text, url
placeholder="text" text that appears in input box until user begins to type
value="value" the text to be submitted if an element is selected or the text that appears on a button
width (width of text box);
checked (used with option buttons or check boxes to show selected);
name (name of an element);
other attributes autofocus (which elements gets focus);
pattern (specifies an regular expression that a value is checked against)
required (must be filled in)
size (width of an element)
legend caption that displays in the grouping border; used in conjunction with <fieldset> tag

! 1 SYST10049 - Reference
! 2 SYST10049 - Reference
li list item content in an ordered (<ol>) or unordered (<ul>) list
link makes the contents of an external file available
href="filename | url" specifies external file destination
rel="keyword" keyword specifying the type of link
media="media" media for which the linked resource is intended
type="type" MIME type of the linked resource
meta enables passing of information about a Web page to the user agent that opens it
name="name" type of metadata being provided (standard metadata names)
http-equiv="keyword" directions to user agent for Web page handling
content="content" content of the metadata described by the "name" value
ol an ordered list; used in conjunction with <li> tag
section encloses content focused on a common theme
source location and encoding of an audio or video file
src="path/filename" path and filename of an audio or video file
type="MIME; codecs='codecs'" specifies the container format and codecs used to encode the file
style encloses style sheet code
type="type" styling language
table specifies content to present as a table
td specifies the contents of a table data cell
colspan="#" number of columns that a cell spans
rowspan="#" number or rows that a cell spans
textare
specifies a multiline area where a user can enter text
a
cols="value" approximate number of cahracters that should fit across the box (monospace font)
rows="value" specifies how many rows are available for input
th specifies the contents of a table header cell
colspan="#" number of columns that a cell spans
rowspan="#" number or rows that a cell spans
title specifies the text that appears in the title bar or tab of the Web browser
tr encloses table data cells that make up a single table row
ul an unordered list - specifies a list in which the order does not matter; used in conjunction with <li> tag
video inserts a video
autoplay="autoplay | none" video begins playing when page is loaded (without user intervention)
controls="controls | none" requests that the browser display its default playback controls
height="#"... width="#" height and width of element (in pixels)
loop="loop | none" restart playback each time it reaches the end of the clip
poster="path/filename" specifies path and filename to an image that is displayed before video starts
src="path/filename" path and filename to the audio clip
type="MIME; codecs='codecs'" specifies the container format and codecs used to encode the file
other attributes audio, preload

! 3 SYST10049 - Reference
! 4 SYST10049 - Reference
CSS Properties (partial list for Final Exam)

CSS Description Values

value of either a color name, rgb triplet, hsl
triplet, rgba value,hsla, or url()

the background color or image for an background-color:

background
element background-image: url()
background-size:px | % | cover | contain
background-repeat: repeat | no-repeat |
repeat-x | repeat-y
Color: rgba | hsla | color name
Style: dotted; dashed; solid; double; groove; ridge;
inset; outset
all settings for the border around an Width: thin; medium; thick; value in em, pixels, or
border
element any supported unit

Note: specify for one or more sides (ex. border-top-

width, border-left-width, ...)
specifies whether adjacent table cell
border-collapse borders are displayed separately or separate (default); collapse
merged
specifies for one or more corners of an
element (NOTE: a border does not have to be
rounding of specified corner(s) of the used for border-radius to be enabled)
border-radius
element
top/left  top.right bottom/right 
bottom/left
 syntax of property is different depending
on browser (ex. Firefox: -moz-box-shadow;
Safari: -webkit-box-shadow)
 If "inset" precedes settings, shadow draws
inside element
box-shadow shadow behind a block element
 Multiple shadow settings are layered from
front to back and are separated by
commas
 Shadows do not influence layout or trigger
scrolling
+ (positive) value moves to the right
horizontal offset (required)
- (negative) value moves to the left
+ (positive) value moves from bottom
vertical offset (required)
- (negative) value moves from top
blur distance (optional) only + (positive) values allowed
+ (positive) expands in all directions
spread distance (optional)
- (negative) causes shadow to contract
color all colours available
used to prevent element from being
clear displayed to the left, right, or either side left; right; both
of an element
! 5 SYST10049 - Reference
color foreground color - most often text color color name | rgba | hsla
type of box that is created for an
display element; "none" removes the element block | inline-block | none
from page flow
left; right
align the top of an element with the top
float of the next element and with the edge of
Used in conjunction with
the parent element
clear: left | right | both
font-family the font family for displayed text family-name
the font size for displayed text (relative
font-size size in em, pixels, or a supported unit
or absolute)
determines whether text is displayed
font-style normal (default); italic
standard or italic
determines whether font is displayed normal (default); bold; 100; 200; 300; 400; 500;
font-weight
normally, bold or shade in-between 600; 700; 800; 900
offset from the specified edge of the
size in em, pixels, or a supported unit; percent (%)
left, top, right, bottom enclosing element that the element is
of enclosing element
displayed
height/width of an element excluding
height, width any measurable unit
padding, margins or border width
list-style-image image to be used as a list item bullet url('path/filename')
ordered list (ol) - decimal; lower-roman; upper-
list item bullet for an ordered or
list-style-type roman; lower-alpha; upper-alpha; none
unordered list
unordered list (ul) - circle; disc; square; none
size in em, pixels, or a supported unit; percent (%)
buffer space outside of the elements of enclosing element
margin
border specify for one or more sides (ex. margin-top,
margin-left, ...)
size in em, pixels, or a supported unit; percent (%)
space between the element contents of enclosing element
padding
and the border specify for one or more sides (ex. padding-top,
padding-left, ...)
Fixed – uses entire screen as container
Absolute – uses relative container as starting point
position fixed | absolute | relative | static unless not specified then uses entire screen
Relative – moves element relative to current
position
text-align horizontal alignment of text left; right; center; justify
text-decoration define other text properties none; underline; overline; line-through; blink
horizontal offset (required) - vertical offset
(required) - blur (optional-shadow width and
text-shadow shadow behind text
lightness) - color (optional) / see box-shadow for
more detail

! 6 SYST10049 - Reference