HTML Flashcards
Where do you put non-visible content about the HTML document?
Inside the head element
where do you put visible content about the HTML document?
Inside the < body > element
Where do the < head > and < body > tags go in a valid HTML document?
Inside the < html > element
What is the purpose of the < !DOCTYPE > declaration?
The < !DOCTYPE > declaration is the instruction to the web browser about what version of HTML the page is written in.
Give five examples of HTML element types.
- < html >
- < body >
- < title >
- < p >
- < h1 >
What is the purpose of HTML attributes?
Attributes provide additional information about the contents of the element. They appear on the opening tag of the element and are made up of two parts: a name and a value, separated by an equals sign.
Give an example of an HTML entity (escape character).
Ampersand(&) ==> & amp
How do block-level elements affect the document flow?
A Block-level element occupies the entire horizontal space of its parent element (container), and vertical space equal to the height of its contents, thereby creating a “block”.
How do inline elements affect the document flow?
By default, inline elements do not force a new line to begin in the document flow.
What are the default width and height of a block-level element?
By default, a block-level element expands to a width of 100% of its parent container. The height is set to the default auto.
What are the default width and height of an inline element?
The height of an inline element is the height of the content. The width of an inline element is the width of the content. Both height and width are set to auto.
How do you indicate the relative link to a parent directory?
Use ../ to indicate the folder above the current one, then follow it with the file name.
How do you indicate the relative link to a child directory?
For a child folder, use the name of the child folder, followed by a forward slash, then the file name.
How do you indicate the relative link to a grand parent directory?
Repeat the ../ to indicate that you want to go up two folders (rather than one), then follow it with the file name.
Ex. ../../index.html
How do you indicate the relative link to the same directory?
To link to a file in the same folder, just use the file name. (nothing else is needed.)
What is the purpose of an HTML form element?
The HTML element represents a document section that contains interactive controls to submit information to a web server.
Give five examples of form control elements.
- < input >
- < textarea >
- < select >
- < button >
- < option >
Give three examples of type attribute values for HTML < input > elements.
- Radio
- Text
- Checkbox
Is an HTML < input > element a block element or an inline element?
Inline element
What are the six primary HTML elements for creating tables?
- < tr >
- < td >
- < th >
- < thead >
- < tbody >
- < tfoot >
What purpose do the thead and tbody elements serve?
- < thead > The headings of the table should sit inside the thead element
- < tbody > The body of the table should sit inside the tbody element
Give two examples of data that would lend itself well to being displayed in a table.
- Sports results
2. Financial reports
What is the difference between an ordered list and an unordered list in HTML?
Ordered lists have numbers and unordered lists have bullet points
Is an HTML list a block element or an inline element?
Block element.
< li > is also a block element because it takes the entire width
What HTML tag is used to link to another website?
The < a > element (anchor tag)
What is an absolute URL?
URL that includes the protocol and domain name. Links directly to the URL
What is a relative URL?
Links to another section where the URL is placed.
Name three different types of values you can use to specify colors in CSS.
- Hex Codes
- RGB Values
- Color Names
What CSS properties make up the box model?
Border, margin, and padding
Which CSS property pushes boxes away from each other?
Margin
Which CSS property add space between a box’s content and its border?
Padding
What is a pseudo-class?
It is a class added to a selector that specifies a special state of the selected elements
What are CSS pseudo-classes useful for?
Apply styling based on user interaction
Name two types of units that can be used to adjust font-size in CSS.
- px
2. em
What CSS property controls the font used for the text inside an element?
font-family
What is the default flex-direction of a flex container?
Row
What is the default flex-wrap of a flex container?
No wrap
Why do two div elements “vertically stack” on one another by default?
They are block elements
What is the default flex-direction of an element with display: flex?
Row
