CSS 1 Flashcards
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
5 CSS properties for spacing elements (5)
**width and height
sets specific size of content box
5 CSS properties for spacing elements (5)
**padding
space inside the element
5 CSS properties for spacing elements (5)
**margin
- amount of space outside the element
5 CSS properties for spacing elements (5)
**border
displays between padding and margin
by default, block level elements…..
stack on top of each other in the order the HTML was written in
negative margin
- used to move elements outside of the default spacing position
margin: auto
- actually finds the centre of the page
