Elements
components that define page objects
tags
- defines the elements with angle brackets wrapped around the tag name and usually comes in pairs
hr stands for
horizontal rule
for all image tags, what is required is (2)
- src - defines the source
2. alt - a description of the picture
CSS can be written in (3)
- internal CSS, same page
- inline CSS
- External CSS, preferred method
to link a CSS externally, you need a ______ attribute in the ________
link Attribute; head
2 required attributes to link CSS externally (2)
- rel=”stylesheet”
2. href=”…..”
selectors
determines which HTML elements to apply styles to
declaration block
- consists of one or more rules enclosed in curly braces
body {
background: blue;
}
**body
selector
body {
background: blue;
}
**background
property
body {
background: blue;
}
**blue
value
Class selectors (4)
- you define it
- can be applied to multiple elements
- Elements can have multiple classess
- Use a period to declare it in CSS
ID Selector (4)
- Must be unique
- Only one per page
- Elements can only have 1 ID
- Denoted with # in CSS
pseudo class
- selects a state of the element
CSS inheritance
- an ancestor “inherits” the CSS of its descendants
Specificity
- determines which CSS rule will take precedence
How is specificity calculated (4)
- Inline = 1000
- ID’s = 100
- classes = 10
- Elements and pseudo elements = 1
typography
- the study of the design and the use of type for communication
typeface
- a set of fonts, designed with common characteristics compose in glyphs
font
- individual files that are part of a typeface
line-height
- sets the height of the space between 2 lines of text
as a rule of thumb, line height should be….
larger than font size
5 CSS properties for spacing elements (5)
- width
- height
- padding
- margin
- border
