Layout (grid , Box) Flashcards
Css positioning properties
1. Elements flow normally
2. Posi. Rela to its nearest position
3. Posi relative to NORMAL POSITION
- Toggles relative n fixed depending on SCROLL
- Static
- Absolute
- Relative
- Absolute
Align-items has 5
- Stretch
1.2. Fles start
13 flex end
1.4. Flex center
1.5flex baseline
An HTML element becomes a grid container when its display property is set to —- or —-
- The vertical lines of grid items are called??. N horizontal are ??
- This property defines the number of columns in your grid layout, and it can define the width of each column
- property defines the height of each row.
- Grid / inline grid
- columns & rows
- Grid-template-columns
4, grud template rows
- Which model includes margin, border, padding, and content
A CSS Box model
B. CSS3 Flexbox Box model
C. CSS3 Grid Layout model
- Which model defines structures similar to tables using 2 dimensions?
A. CSS Box model
B CSS3 Flexbox Box model
C. CSS3 Grid Layout model - You are creating a grid layout. What does 1fr mean in the following code?
grid-template-columns: 150px 150px 1fr 1fr;
- Css box model
- Css3 grid layout model
Grid area:1? /?2 /?3 /?4
1= row start
2 column start
3 grud end row
5 grud end. column
- You can use the ?? property to name grid item
- grid-area or ref fered as grid template areas when setting up
To name ex:
.grid{
Grid template areas : ‘ mm’ ‘11’;)
- What does the fr measurement unit do?
A. It takes as much space as possible
B. It makes the grid contract
C. It expands the lines of the cel
2 What is the syntax for the repeat() function?
A. repeat(size, times)
B. repeat(times, size)
C. repeat(size)(times)
- How can I make a column respect a maximum or a minimum size?
- Using maxSize() function
B. Using minmax() function
C. Using min-max property
- A
- B
- B min max FUNCTION
- How can I align the content INSIDE of the grid cells?
A. Using place-items
B. Using place-content - How can I align the grid cells?
A. Using place-items
B. Using place-content
1.a. Place items
2. Place content
- Which class provides a responsive fixed width container?
AContainer fluid
B. Container-fixed
C. Container - Which class provides a full width container, spanning the entire width of the viewport?
AContainer fluid
B. Container-fixed
C. Container - Which class adds zebra-stripes to a table?
A. Tablebordered
B. Even n odd
C.table%zebra
D. Table striped
- Responsive = Container
- Con fluid
- D. Table striped
- Which class is used to create a big box for calling extra attention
- jumbotron
- bigbox - Which class is used to create a button group?
A. Button-group
B. Group btx
C btn-group
- Jumbotron
- Btn-group
1 How can you insert a search icon