HTML Flashcards
Where do you put non-visible content about the HTML document?
Head Element
Where do you put visible content about the HTML document?
Body Element
Where do the head element and body element tags go in a valid HTML document?
Within the html element
What is the purpose of a DOCTYPE declaration?
To declare to the browser what HTML type the page is using.
Give five examples of HTML element tags
<a> <img></img></a>
What is the purpose of HTML attributes?
To provide more information to the HTML elements.
Give an example of an HTML entity (escape character)
© “!copy;”
How do block-level elements affect the document flow?
They start a new line and take up the entire span of the parent element.
How do inline elements affect the document flow?
They only take up the space of the content that they enclose and share the same line as their neighboring elements.
What are the default width and height of a block-level element?
Width: 100% Height: auto
What are the default width and height of an inline element?
Width: auto Height: auto
What is the difference between an ordered list and an unordered list in HTML?
Ordered lists are numbered and unordered lists are marked by bullet points
Is an HTML list a block element or an inline element?
Block element
What HTML tag is used to link to another website?
Anchor tag
What is an absolute URL?
The full web address of an external website
What is a relative URL?
Short hand address to pages within the same website
How do you indicate the relative link to a parent directory?
../”example.html”
How do you indicate the relative link to a child directory?
Just refer directly to the target directory
How do you indicate the relative link to a grand parent directory?
../../example.html
How do you indicate the relative link to the same directory?
Just use the file name directly
What is the purpose of an HTML form element?
To collect data from the end user
Give five examples of form control elements.
input, text area, select, option, button
Give three examples of type attributes for HTML input elements.
text, password, radio, checkbox, file, submit, image, hidden
Is an HTML input element a block element or an inline element?
inline element
What are the six primary HTML elements for creating tables?
table, th, tr, td, thead, tbody
What purpose do the thead and tbody elements serve?
thead houses the headings of the table and tbody houses the data of the table
Give two examples of data that would lend itself well to being displayed in a table.
Train ticket prices and sports results
What are the names of the individual pieces of a CSS rule?
selector, declaration block, property, value
In CSS, how do you select elements by their class attribute?
Add a . before the class name
In CSS, how do you select elements by their type?
Just use the element type name
In CSS, how do you select an element by its id attribute?
Add a # before the id name
Name three different types of values you can use to specify colors in CSS.
Color name, RGB value, hex code
What CSS properties make up the box model?
content, padding, border, margin
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?
Keyword applied by the browser to an element for specific circumstances such as user’s interaction ie hovering over the element
What are CSS pseudo-classes useful for?
Applying styling based on user’s interaction
Name at least two units of type size in CSS.
pixel, percentage, ems
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?
nowrap
Why do two div elements “vertically stack” on one another by default?
div elements are block-level elements
What is the default flex-direction of an element with display: flex?
row
