Section 1
Preview this deck
grid-template-rows
Front
| 5 | 0 | ||
| 4 | 0 | ||
| 3 | 0 | ||
| 2 | 0 | ||
| 1 | 0 |
Active users
0
All-time users
0
Favorites
0
Last updated
6 years ago
Date created
Mar 1, 2020
Cards (52)
Section 1
(50 cards)
grid-template-rows
defines height of rows
opacity
makes an element transparent
box-sizing
dictates how HTML will render content that overflows its parent's content area; content-box: default value, border-box: value for new border box
font-family
defines the typeface of an element
grid-row
shorthand for grid-row-start and grid-row-end, use / between values
display
allows you control how an element flows vertically and horizontally a document
line-height
modifies the leading of text
display: float
can move elements as far left or as far right as possible on a web page
letter-spacing
kerning; increasing the spacing between individual letters
grid-column
shorthand for grid-column-start and grid-column-end, use / between values
align-items
positions grid items along the block, or column axis (start, end, center, stretch)
visibility
dictates how HTML will render content that overflows its parent's content area
z-index
specifies how far back or how far forward an element appears on the page when it overlaps other elements
text-transform
style text to appear in either all uppercase or lowercase
grid-row-start, grid-row-end
can make single grid items take up multiple rows; grid-row-start should be the row at which you want the grid item to begin, the value for grid-row-end should be one greater than the row at which you want the grid item to end
padding
the space between the content area and the border
grid-row-gap
puts blank space between rows
display: inline-block
can have set width and height, but they can also appear next to each other and do not take up their entire container width
justify-content
position the entire grid along the row axis (start, end, center, stretch, space-around, space-between, space-evenly...)
overflow
dictates how HTML will render content that overflows its parent's content area (display, hide, scroll)
justify-items
positions grid items along the inline, or row, axis (start, end, center, stretch)
font-weight
defines how thin or thick text is displayed
span
used to start or end a column or row relative to its other end
position: relative
element's position is relative to its default position on the page
clear
specifies how elements should behave when they bump into each other on the page (left, right, both, none)
display: inline
take up as little space as possible, and they cannot have manually-adjusted width or height
font-size
controls the size of text displayed
border
surround the content area and padding of an element
color
styles an element's foreground color
grid-column-gap
puts blank space between columns
grid-column-start, grid-column-end
can make single grid items take up multiple columns; grid-column-start should be the column at which you want the grid item to begin, the value for grid-column-end should be one greater than the column at which you want the grid item to end
justify-self
specifies how an individual element should position itself with respect to the row axis (start, end, center, stretch)
align-content
positions the rows along the column axis, or from top to bottom (start, end, center, stretch, space-around, space-between, space-evenly...)
position
allows you to specify the position of an element in three different ways
align-self
specifies how an individual element should position itself with respect to the column axis (start, end, center, stretch)
grid-template-columns
defines width of columns
grid-auto-rows
specifies the height of implicitly added grid rows
grid-gap
defines gaps between rows then columns (no /)
text-align
places text in the left, right, or center of its parent container
background-image
set the background of an element to an image
background-color
styles an element's background color
word-spacing
increase the spacing between words in a body of text
margin: 0 auto
horizontally centers an element inside of its parent content area, if it has a width
margin
the amount of spacing outside of an element's border
position: absolute
element's position is relative to its closest positioned parent element, can be pinned to any part of the web page, but the element will still move with the rest of the document when the page is scrolled
position: fixed
element's position can be pinned to any part of the web page, element will remain in view no matter what.
grid-template
the values before the slash will determine the size of each row, the values after the slash determine the size of each column
display: block
take up the width of their container and can have manually-adjusted heights
font-style
normal, bold, italic
grid-area
set the starting and ending positions for both the rows and columns of an item, grid-row-start / grid-column-start / grid-row-end /grid-column-end
Section 2
(2 cards)