HTML & CSS- part 7 Flashcards
What’s the non-standard way to indent an unordered list?
Indent only the first line of text and make all other lines flush with the bullet:
ul {list-style-position: inside;}
In list, what are the markers?
Markers are the bullets in an unordered list or the numbers in an ordered list.
What options do you have for changing the markers in an UNordered list?
What’s the code?
ul {list-style-type: x;}
disc (solid and round)
circle (this is just the outline of a circle)
square
What options do you have for changing the markers in an ordered list?
What’s the code?
Six pairs:
ol {list-style-type: x;}
decimal—1, 2, 3 etc.
decimal-leading-zero—01, 02, 03
lower-alpha—a, b, c
upper-alpha—A, B, C
lower-roman—i., ii., iii
upper-roman—I, II, III
Can you use a picture as a list item marker?
What’s the code?
Yes, though it’s not advised.
ul {list-style-image: url(“image address”);}
In CSS, what’s the text that goes in front of { called?
A CSS selector is everything on the first line that precedes the {.
It’s the part of a style rule that tells the browser what elements, classes, and IDs a rule applies to
What does this mean? div > p { ?
It selects all <p> that are the child of a <div>
In CSS, what is the Universal Selector that selects all the elements on a page?
* {
In CSS, what is a combinator?
A symbol or space…
used in the selector area…
to specify the relationship of the selectors to each other
What are the four combinators?
(space)
>
+
~
What does this combinator mean?
div p {
What’s it called?
It selects all <p> elements inside <div> elements.
It’s called the Descendant Selector
What does this combinator mean?
div > p {
What’s it called?
It selects all <p> elements that are children of a <div> element.
It’s called the Child Selector
What does this combinator mean?
div + p {
What’s it called?
It selects the first <p> element that are placed immediately after <div> elements.
It’s called the Adjacent Sibling Selector
What does this combinator mean?
div ~ p {
What’s it called?
It selects all <p> elements that are next siblings of <div> elements.
It’s called the General Sibling Selector
What’s a good way to think of a table?
Tables are really just rows stacked on top of each other.
You build a table a row at a time, from the top.
What are the two and a half main tags in a table, besides <table>?
<tr> = Table Row
<th> = Table Heading OR <td> = Table Data
If it’s a five column table, then how many items will be in each row?
Five
How would a column Table Heading look different from a row Table Heading?
Column: <th scope="col">Dog</th>
Row: <th scope="row">Dog</th>
What does the skeleton of the code for a table look like?
<table>
<tr> (indented two spaces)
<th> or <td> (indented four spaces)
</tr> (indented two spaces)
</table>
How do you get a Table Heading or Table Data to spread across two columns?
What about two rows?
colspan=”2” will span two columns
rowspan=”2” will span two rows
Use these in the <th> or <td> tags
