HTML Flashcards
Where do you put non-visible content about the HTML document?
In the head element
Where do you put visible content about the HTML document?
In the body element
Where do the and tags go in a valid HTML document?
Siblings, children of HTML element
What is the purpose of a declaration?
To declare the type of the document.
Give five examples of HTML element types.
HTML, head, title, body, h1
What is the purpose of HTML attributes?
Provide additional information about the contents of an element
Give an example of an HTML entity (escape character).
© for copyrighted symbol
How do block-level elements affect the document flow?
They take up the width of the parent element. Push content on the left up and content on the right down.
How do inline elements affect the document flow?
Take up whatever space is needed for the content and doesn’t move any element around.
What are the default width and height of a block-level element?
The width and height of the parent
What are the default width and height of an inline element?
Width and height of whatever space is needed for the content.
What is the difference between an ordered list and an unordered list in HTML?
An ordered list has numbers labeled in ordered pairs while an unordered list has bullet points.
Is an HTML list a block element or an inline element?
block
What HTML tag is used to link to another website?
Anchor
What is an absolute URL?
A direct address
What is a relative URL?
Shorthand name for the file within directory.
How do you indicate the relative link to a parent directory?
../
How do you indicate the relative link to a child directory?
/
How do you indicate the relative link to a grand parent directory?
../../
How do you indicate the relative link to the same directory?
file name
What is the purpose of an HTML form element?
To collect info from the user
Give five examples of form control elements
Select, textarea, form, button, radio
Three examples of type attribute values for HTML input elements
Text, radio, checkbox
Is HTML element a block element or an inline element?
Inline block element
What are the six primary HTML elements for creating tables?
table, thead, tr, td, tbody, th, tfoot
What purpose do the thead and tbody elements serve?
thead is for headings while body is for every other content
What are the names of the individual pieces of a CSS rule?
rulesets
In CSS, how do you select elements by their class attribute?
by placing a period at the start
In CSS, how do you select elements by their tag name?
with their tag name
In CSS, how do you select an element by its id attribute?
with the pound sign followed by attribute value
What CSS properties make up the box model?
border, margin, padding, and content
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 to change an element when it is in a certain state
What are the CSS pseudo-classes useful for
help the user with visual feedback
Name two types of units that can be used to adjust font-size in CSS.
px and 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?
nowrap
Why do two div elements “vertically stack” on one another by default?
because they are display:block
What is the default value for the position property of HTML elements?
static
How does setting position: relative on an element affect document flow?
the. document flow. like the element was never changed.
How does setting position: relative on an element affect where it appears on the page?
How does setting position: absolute on an element affect document flow?
removes element from document flow
How does setting position: absolute on an element affect where it appears on the page?
it is out of the document flow
How do you constrain an absolutely positioned element to a containing block?
put it in a nonstatic ancestor
What are the four box offset properties?
distances from top bottom left and right
What is the default value for the position property of HTML elements?
static
How does setting position: relative on an element affect document flow?
the document flow stays the same
How does setting position: relative on an element affect where it appears on the page?
it depends on how you choose to position it in relation to it’s original position
How does setting position: absolute on an element affect document flow?
it takes the element out of the flow
How does setting position: absolute on an element affect where it appears on the page?
positions its pixels from the side you set
How do you constrain an absolutely positioned element to a containing block?
put it to a non static parent
What does it mean to say that variable names are “case sensitive”?
capitalization needs to stay consistent
What is the purpose of a string?
To have text that the computer can read
What is the purpose of a string?
To have text that the computer can read
What is the purpose of a number?
math operations
What is the purpose of a boolean?
decision making
What characters are allowed in variable names?
letters, numbers not at the start, $, underscores,
How do you initialize (assign a value to) a variable?
keyword for variable, variable name, assignment operator, and value
How do you declare a variable?
keyword for variable, variable name, assignment operator, and value
What does the = operator mean in JavaScript?
assignment operator
What is the purpose of variables?
to store values
How do you update the value of a variable?
define another variable without keyword
What is the difference between null and undefined?
null is a placeholder value, undefined has no value.
null has to be defined, it is how a programmer says empty.
undefined is how javascript says empty
Why is it a good habit to include “labels” when you log values to the browser console?
easier to organize
Why is it a good habit to include “labels” when you log values to the browser console?
What data type is returned by an arithmetic operation?
numerical value
What is string concatenation?
combing two strings together to make a new string
What purpose(s) does the + plus operator serve in JavaScript?
to add numbers and concatenate strings
What data type is returned by comparing two values (<, >, ===, etc)?
boolean
What are objects used for?
to store info in a more flexible way
gives you the ability to store multiple pieces of data in one name
What are object properties?
variables that part of an object
Describe object literal notation.
keyword variable name assignment operator to curly braces, operators are made by a name, colon, then data. properties are separated by commas
How do you remove a property from an object?
delete operator
What are arrays used for?
to have a list of data
Describe array literal notation.
square bracket with values separated by commas
How are arrays different from “plain” objects?
index values are different, to add to an object you assign it like a variable, whereas in arrays you have to use the push method.
What number represents the first index of an array?
0
What is the length property of an array?
gets how many items are in an array
How do you calculate the last index of an array?
array length - 1
What is a function in JavaScript?
list of steps that can be reused multiple times
Describe the parts of a function definition.
function keyword, optional name, parameter list, opening curly brace, code block, closing curly brace
Describe the parts of a function call.
function name, followed by parentheses with optional arguments
When comparing them side-by-side, what are the differences between a function call and a function definition?
a definition says function and curly brace, while a call only has function name and parenthesis
What is the difference between a parameter and an argument?
parameter is a placeholder for the future value, argument is the actual value. parameter is used when you are defining a function while arguments are used when you are calling the function
Why are function parameters useful?
create variables within function
What two effects does a return statement have on the behavior of a function?
allows the rsult of the function to be used out of the function and exits the function
Why do we log things to the console?
to see the state of our code
What is a method?
function in an object
How is a method different from any other function?
it belongs to an object. prepend it with dot and name of object
How do you remove the last element from an array?
pop method
How do you round a number down to the nearest integer?
floor method of math object
How do you generate a random number?
random method of math object
How do you delete an element from an array?
splice method
How do you append an element to an array?
push
How do you break a string up into an array?
split method
Do string methods change the original string? How would you check if you weren’t sure?
they do not, and console.log to check
Do string methods change the original string? How would you check if you weren’t sure?
they do not, and console.log to check
Roughly how many string methods are there according to the MDN Web docs?
50
Is the return value of a function or method useful in every situation?
no
Roughly how many array methods are there according to the MDN Web docs?
a lot
What three-letter acronym should you always include in your Google search about a JavaScript method or CSS property?
mdn
Give 6 examples of comparison operators.
> < >= <= == ===
What data type do comparison expressions evaluate to?
boolean
What is the purpose of an if statement?
allows us to make branching decisions
Is else required in order to use an if statement?
no
Describe the syntax (structure) of an if statement.
if statement, parenthesis, condition, curly braces for code
What are the three logical operators?
||, &&, !
What is the purpose of a loop?
to repeat an action
What is the purpose of a condition expression in a loop?
dictate when the loop stops
What does “iteration” mean in the context of loops?
one repetition
When does the condition expression of a while loop get evaluated?
before the code block on each iteration
When does the initialization expression of a for loop get evaluated?
at the beginning of a loop once
When does the condition expression of a for loop get evaluated?
before each loop iteration
When does the final expression of a for loop get evaluated?
after the code block is ran
Besides a return statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to false?
break
What does the ++ increment operator do?
increment one
What are the four components of “the Cascade”.
source order, specificity, and inheritance
What does the term “source order” mean with respect to CSS?
the order in which rulesets are declared
How is it possible for the styles of an element to be applied to its children as well without an additional CSS rule?
yes, inheritance
List the three selector types in order of increasing specificity.
type, class, and id
Why is using !important considered bad practice?
strongest way to style, if u use it often it can make your code less flexible
what does the transform css property do?
it allows you to rotate, scale, skew or translate an element?