Coding 2

Question 1

what is !DOCTYPE html?

Answer 1

its the first thing in a html document, it tells the browser that its html 5

Question 2

what is the html tag?

Answer 2

it is the root element, meaning all other elements exist within it

Question 3

what is the head tag?

Answer 3

child of html tag-

it is where we bundle information about our document, link fonts and titles. Not stuff you generally see on the web page

Question 4

How many different types of elements can be in the head element

Answer 4

7

Question 5

what is the meta tag?

Answer 5

child of the head tag-

it is a versatile tag. Each instance carries different information about the document such as the character encoding and the pages dimensions

Question 6

what is charset?

Answer 6

goes with a meta tag-

tells the browser about the character encoding

Question 7

what is viewport?

Answer 7

goes with a meta tag-

tells the browser about the pages dimensions

Question 8

what is the title tag?

Answer 8

child of the head tag-

the text that is put here, goes on the browser tab when the web page is opened.

Question 9

is the title tag required for all HTML documents?

Answer 9

Yes it is.

Question 10

why is it important for HTML documents to have a title?

Answer 10

Webcrawlers look for this element to help them index the web page correctly which helps with SEO

Question 11

What is SEO?

Answer 11

Search Engine Optimization

Question 12

What is the link tag?

Answer 12

child of the head tag –

used to link the html page to other resources like fonts and stylesheets

Question 13

what is the body tag?

Answer 13

child of the html tag-

this where the main displayable content of the webpage is put

Question 14

what is the h1 tag?

Answer 14

a first level heading tag. It has default styling which will make it large and bold. There is only one of these on a page.

Question 15

what is h2 -h6?

Answer 15

lower level heading tags, these also have default styling properties. More than one of these can be used per page

Question 16

Should we skip lower level heading tags ? h2-h6?

Answer 16

no we should not skip them, just go in order - do not choose the head line tag based on shape or size. These will be adjusted in CSS

Question 17

what is the importance of header tags?

Answer 17

they help web crawlers know what the page is about, so its also important for SEO

Question 18

what is the p tag?

Answer 18

child of the body -

used to say that the text put here is a paragraph

Question 19

what is the ul tag?

Answer 19

it is the unnumbered list tag, it creates a list of bulleted items

Question 20

what is li tag?

Answer 20

it is a child of ul tag-

it is a listed item under a ul

Question 21

what is an A tag?

Answer 21

its an anchor tag, which is used to create a clickable link that leads people to other websites or other pages on web page.

Question 22

what is a div tag?

Answer 22

it is a basic generic container tag, that is used to group content together.

Question 23

what do we wrap our elements in ?

Answer 23

opening and closing tags

Question 24

what is the difference between opening and closing tags?

Answer 24

they are identical except for the fact that closing tags have a forward slash infront of the tag name

Question 25

what is the anchor tag plus the href attribute used for?

Answer 25

it is used for creating a link that either links to another website or another page on the same website

Question 26

what are shorthand properties?

Answer 26

are CSS properties that let you set the values of multiple other CSS properties simultaneously.

For instance, the CSS BACKGROUND property is a shorthand property that’s able to define the values of background-color, background-image, background-repeat, and background-position

Question 27

what happens when you use a shorthand property and dont set a specific value?

Answer 27

the value is set to its default value, which means that it overrides previously set values.

FOR EXAMPLE

background-color: red;
background: url(images/bg.gif) no-repeat left top;

will not set the color of the background to red but to background-color’s default, transparent, as the second rule has precedence.

Question 28

What is background-color’s default value?

Answer 28

transparent

Question 29

what is the css property ‘border’?

Answer 29

its a shorthand property that sets an elements border

Question 30

what values does the shorthand property border set?

Answer 30

border-width
border-style
border-border color

Question 31

Can border be used to set the value for border-image?

Answer 31

no it cannot, it can only reset its value to the default value….which is none

Question 32

border is best used when?

Answer 32

when you want all four borders to be the same.

Question 33

what should you use if you want to make the borders different from each other?

Answer 33

you can use the longhand border-width, border-style, and border-color properties, which accept different values for each side

Question 34

what should you use if you want to focus on one border at a time?

Answer 34

Alternatively, you can target one border at a time with the physical (e.g., border-top )

Question 35

what is the default value of border?

Answer 35

none

Question 36

Measurement values for properties when only one measurement is specified effects what?

Answer 36

all four sides

border-width: 2px

all four sides will be 2px

Question 37

Measurement values for properties when two measurements are specified, effects what?

Answer 37

When 2 values are specified, the first width applies to the top and bottom, the second to the left and right

Question 38

Measurement values for properties when 3 measurements are specified, effects what?

Answer 38

When three values are specified, the first width applies to the top, the second to the left and right, the third to the bottom.

Question 39

Measurement values for properties when 4 measurements are specified, effects what?

Answer 39

When four values are specified, the widths apply to the top, right, bottom, and left in that order (clockwise).

Question 40

when using multiple non measurable values on a border property, does the order matter?

Answer 40

no it doesn’t.

border: solid black 2px thinck;
OR
border: 2px solid black thick;

and it will render the same

Question 41

what is the padding property?

Answer 41

it is a shorthand property that sets the padding area on all four sides of an element.

it increases the space between the content and the border

Question 42

What is an elements padding area?

Answer 42

it is the area between its content and its border

Question 43

can a value for the padding property ever be negative?

Answer 43

no it is not possible

Question 44

the padding property is shorthand for what?

Answer 44

padding-top, padding-right, padding-bottom, and padding-left.

Question 45

what are the possible values for padding tag?

Answer 45

either specific length measurements or percentage relative to the width of the containing block.

Question 46

difference between using the padding on an element and using the padding in the body of a document?

Answer 46

when using padding on an element, it pushes the border out away from the inner content which can be text or a picture or anything,

when using padding on the body, the border itself is considered the content, so as the padding is increased things are pushed towards the center of the page and away from the edges.

so there are two ways to get something off of the edge of the browser page. Adjusting the padding on the element will move just that element. Adjusting the body will effect everything

Question 47

why is html not considered a full fledged programming language?

Answer 47

because it doesn’t allow logical statements

Question 48

what are logical statements?

Answer 48

logical statements are when you set up code to behave one way if a statement is true and behave another way if the behavior is not

Question 49

what are tags used for?

Answer 49

marking off the beginning and usually the end of an element

Question 50

do all tags have closing tags?

Answer 50

no some tags are closing tags so they do not have closing tags

Question 51

what is an html element?

Answer 51

a function, a piece of content or a group content represented and sectioned off by tags

Question 52

what are html attributes?

Answer 52

attributes are used for setting properties on an html element

Question 53

class and id are attributes that can be used on all html elements except for?

Answer 53

• base
• meta
• head
• param
• title

Question 54

what element is the href attribute specific to?

Answer 54

a

the anchor element

Question 55

what do we mean when we say html is about structuring content?

Answer 55

we mean it
1. specifies each and every one of its elements, whether seen by the user or not

2. specifies the hierarchical relationship between elements in a document

Question 56

elements that have the same hierarchical level are called what?

Answer 56

siblings

Question 57

elements that are one step lower than another element are called what?

Answer 57

children

Question 58

elements that are one step higher than another element are called what?

Answer 58

parents

Question 59

elements that are two or more steps lower than another element are called what?

Answer 59

descendants

Question 60

what goes in the header tag?

Answer 60

the h1 element - which is the most important header on the page. Its what the page is about.

Question 61

how many h1 should be on a page?

Answer 61

only one

Question 62

where does the header tag go?

Answer 62

in the body, before the main

Question 63

where does h2 -h6 go?

Answer 63

in the main section

Question 64

can we have more than one h2 - h6?

Answer 64

yes as many as you want

Question 65

should we skip the order of h2 - h6?

Answer 65

no, you shouldn’t jump from h2 - h5

Question 66

should we chose our headline based on the default styling properties of the h’s?

Answer 66

no you can adjust all of that in css

Question 67

what is a css reset?

Answer 67

frontend developers often use what is called a CSS reset to zero out default styles and ensure a consistent user experience across browsers.

Question 68

two ways to make a comment tag

Answer 68

1. /* */

2. control + /

Question 69

what is commenting out code?

Answer 69

intentionally using the comment tag around code to disable it so you can debug it or put it to the side for later

Question 70

what is semantic html and what does it mean?

Answer 70

when you’re choosing an HTML element to wrap content, you should choose the one that most clearly aligns with the meaning of your content. For instance, if you’re putting a paragraph of content into the body of your HTML page, use a p element (and not, say, a div

Question 71

what is the max-width/height property?

Answer 71

it sets the maximum width/height of a property.

Question 72

what does max width over ride?

Answer 72

width

Question 73

what does overflow: scroll do?

Answer 73

when the content of an element goes outside of the height and width you can use this to create a scroll bar

Question 74

what overrides max width?

Answer 74

min width

Question 75

what does min width/height do?

Answer 75

sets the minimum width/height of a property

Question 76

why is a block like element like a gas?

Answer 76

because it will take up the size of whatever container/parent element it is put in. it stretches as far as it can up down and left and right

Question 77

how much space does an image take up?

Answer 77

it takes up all the space it can, only being constrained by its natural height and width dimensions

Question 78

if an image is larger than the div or parent element it is put in what happens?

Answer 78

the image exceeds the div or parent element

Question 79

what happens when you put a image that larger than the browser window?

Answer 79

it gets a scroll bar

Question 80

how do we resize an image?

Answer 80

in css, you mage the image the selector and change the width and the height

Question 81

how do you set up a hyperlink that will open up the destination in a new tab?

Answer 81

(a href=”website.com”target=”_blank”)Name of link(/a)

Question 82

how do you set up a link that opens up the user’s email client to send an email to a specific address?

Answer 82

(a href=”mailto:address@email.com”)name of link(/a)

Question 83

how do you set up a link that opens the user’s email client to send an email to a person of the user’s choosing?

Answer 83

(a href=”mailto:”)name of link(/a)

Question 84

what additional features can you add to the “mailto” href pattern?

Answer 84

you can cc , bcc, add a subject and add text in the body of the email

Question 85

when adding additional features to “mailto” pattern with a destination email, do you put extra features inside the same quotations as the email? or do you create its own set?

Answer 85

you include it inside the same quotations

a href=”email.com?subject=check out this email”>email us(/a

Question 86

when you’re adding one additional feature to a mailto pattern, what do you use to set apart the email and the additional feature?

Answer 86

you use a question mark ?

a href=”email.com?subject=check out this email”>email us(/a

Question 87

when you’re adding two or more additional features to a mailto pattern, what do you use to set apart the email and the additional features?

Answer 87

you use the ? mark for the first one and then &’s for the rest

(a href=”email.com?subject=check out this email&cc=baysauce415@yahoo.com&bcc=halaup16@gmail.com”>email us(/a)

Question 88

when adding additional features to a mailto pattern, does the whole value share one set of quotations?

Answer 88

yes, they all share one set of quotations

a href=”email.com?subject=check out this email&cc=baysauce415@yahoo.com&bcc=halaup16@gmail.com”>email us(/a

Question 89

what is a good reason to leave the destination email blank when creating a mailto pattern?

Answer 89

for a share button, when you want the user to share something with their friends or associates

Question 90

whens a good time to fill the email destination in a mailto pattern?

Answer 90

for contact info or to sign up or subscribe to something

Question 91

is it possible to add additional features to a mailto pattern that has a blank email destination?

Answer 91

yes of course, just add the ? directly after the mailto pattern - they share one quotation as well

(a href=”mailto:?subject=hey there”)click here(/a)

Question 92

when creating a href that opening in another window, does the target=”_blank” share the same quotations as the destination web address?

Answer 92

no it doesnt, it gets its own set of quotations, its its own attribute

(a href=”website.com”target=”_blank”)two different attributes(/a)

Question 93

what is the alt attribute and name two reasons we use it?

Answer 93

it gives text to the image that will display in the even that the image isnt able to display.

also, the text is read aloud by screen readers which is used by visually impaired users

Question 94

do we need to use an alt attribute everytime we use an image?

Answer 94

yes every single time

Question 95

what is the video tag?

Answer 95

the video tag allows you add videos to your page, much in the same way you use images.

(video src=”www.videoaddress.mp4”)(/video)

Question 96

what are some of the common attributes used with the video tag?

Answer 96

autoplay, loop, controls, and muted

Question 97

how do you add attributes to the video tag?

Answer 97

add one or more of the attribute names before or after the src with no commas or quotes inside of the opening tag

Question 98

does the video tag need a closing tag?

Answer 98

yes it does

Question 99

what is a video extension?

Answer 99

it is the part of the url that points to the video source itself

(.mp4, .avi, etc)

Question 100

what do we know about a url for a video that doesnt have a video extension?

Answer 100

it means that its pointing to the page and not to the video, so in order to add the video to a webpage youre going to have to do a little more digging

Question 101

what does the attribute target do?

Answer 101

target specifies when a link is clicked where it is opened up

Question 102

what is the default value for the target attribute on links?

Answer 102

it is “_self”

meaning if you want it to open up in a different window you must set the target attribute and change it manually

Question 103

what does the value “_self” on the target attribute do?

Answer 103

it opens up the clicked link in the same window being used by the user

Question 104

what does the value “_blank” on the target attribute do?

Answer 104

it opens the clicked link in a brand new tab

Question 105

what element are href and target used on ?

Answer 105

(a)

the anchor element

Question 106

when two or more links are placed by each other not under a ul or ol tag which way do they display?

Answer 106

side by side, horizontally

Question 107

can h2 be used in a header tag?

Answer 107

yeah provided it is subtext of a present h1 in the same header tag or a h1 header tag already present somewhere on the page.

Question 108

what does the strong and the b tag do?

Answer 108

its an inline styling element that makes certain part of text bold

Question 109

what does the em and i tag do ?

Answer 109

its an inline styling element that makes certain parts of the text italicized

Question 110

what is a footer tag?

Answer 110

a footer tag is the section closest to the bottom, this usually has contact info, copyrights and various links at the end of web page.

Question 111

where does the footer go?

Answer 111

in the body beneath the main section

Question 112

what is a ruleset?

Answer 112

one or more rules or declarations that are targeting a particular element or aspect of a webpage

Question 113

what is a css selector?

Answer 113

a selector, is the element or aspect of the webpage that is being targeted by the declaration block

Question 114

what are the two parts of the rule set?

Answer 114

selector and declaration box

Question 115

what is the css declaration box?

Answer 115

is a set of rules or declarations that are set to the selector

Question 116

what is the css declaration box contained in?

Answer 116

curly brackets

Question 117

how is a css declaration or a rule constructed?

Answer 117

it is constructed by a property and a value

Question 118

what is a css property?

Answer 118

a property represents the thing that is being changed about the selector.

body {
background-color: black}

the body is the selector,
background color is the property, the thing of the selector that is being changed

Question 119

what is a css value?

Answer 119

a value specifies the exact change in the property

Question 120

can any css value be used with any css property?

Answer 120

no specific values are associated with specific properties

Question 121

what is the css property name followed by?

Answer 121

a colon

Question 122

what is the css value followed by?

Answer 122

a semi colon

Question 123

what is a css universal selector?

Answer 123

it is a selector that applies to everything on the page

Question 124

how do we render a css universal selector?

Answer 124

*{

}

Question 125

how do we target a single element type in css?

Answer 125

single element name {

}

Question 126

how do we target two different css elements?

Answer 126

first element name, second element name {

}

Question 127

how do we target a class in css?

Answer 127

.class name {
}

Question 128

how do we target an id in css?

Answer 128

#id name {
}

Question 129

Should we target id’s as selectors in css?

Answer 129

Avoid these, its usually better to use a class selector instead

Question 130

How do we target an element with a class in css?

Answer 130

element name.class name {
}

Question 131

how to target descendents of an element of a particular class?

Answer 131

element name.class name  descendent name {
}

example:
ul.grocerylist li {
{

all li’’s that are nested under the element classified as grocery list will be targeted.

no matter how deep the li’s are nested they will be targeted

Question 132

when writing out pixel measurements, can you separate the number from the px marker?

Answer 132

No, there can be no space between the two otherwise it wont render properly

Question 133

when targeting two elements in css, does there need to be a space after the comma separating the two elements?

Answer 133

there can be no space or just one space, it doesn’t matter as long as the comma is there

Question 134

are css selectors case sensitive?

Answer 134

yes they are

Question 135

can you target descendents of a generic element with no class?

Answer 135

yes you can

element descendent name {
}

section li {
}

this will target all li’s in any section regardless of the classification of the sections

Question 136

when a browser reads CSS it reads from which way?

Answer 136

it reads from right to left - so the more specific selectors are rendered first and more likely to override ones on the same element that are less specific

Question 137

how do you target direct children of an element?

Answer 137

parent element > child element {

}

Question 138

can we add multiple combinations of selectors to the same declaration block?

Answer 138

yes, just add a comma in between the different selectors in the rule set

footer > p , section li {
border: 16px solid black;
}

this will target the children paragraph of the footer and it will target any li descendant nested anywhere under any section tag

Question 139

when creating rule sets, should we use as many selectors as possible?

Answer 139

no we should use the least amount of selectors as possible.

Question 140

why should we try and use the least amount of selectors as possible when creating rule sets?

Answer 140

because it allows for more flexibility.

for example : we can create a rule set for p.emphasis which would be valid code and get the job done that we want to achieve. But we could also just make a rule set for .emphasis - this would accomplish the same thing.

And if we wanted to put the styling attributes on another element, all we would have to do is create a div for it and classify it as . emphasis and it will automatically take on the new styling properties. This is preferable than having to make a whole new seperate rule set targeting a new specific element

Question 141

what is a pseudo class?

Answer 141

is used to specify a special state of an element

Question 142

what is a pseudo element?

Answer 142

is used to stylize a special part of the element

Question 143

what is a margin?

Answer 143

a margin is the space from the border going outwards - the higher the margin the more space pushed outwards going away from the edge of the border

Question 144

using padding is mainly used for what?

Answer 144

pushing content off the edge of its own border

Question 145

what is margin mainly used for?

Answer 145

pushing other content away from itself

Question 146

when we add numeric values to the border property what increases or decreases?

Answer 146

the thickness of the border only, it doesn’t push or move anything closer or further from it, padding and margin do that

Question 147

what is text align ?

Answer 147

it dictates how the text is formatted in a space

Question 148

what are the some common values to know for text align?

Answer 148

left, right, center and justify, justify-all

Question 149

what does justify mean?

Answer 149

tells the text to fill the entire width of the document so that each line is flush right to the edge, regardless of whether it affects the spacing between words.

it basically makes it into a box, except for the last sentence

Question 150

what is justify all ?

Answer 150

its the same thing as justify except that the last sentence is also justified, meaning that the adjustments in the spacing may be more severe throughout the document.

Question 151

what is border radius?

Answer 151

border radius makes the border curve….0 is a straight box, 100 percent is a complete circle, everything else is varying degrees of rounded edges

Question 152

what is text transform?

Answer 152

specifies how to capitalize an element’s text. It can be used to make text appear in all-uppercase or all-lowercase, or with each word capitalized.

Question 153

what are some of the main values that go on the text transform property?

Answer 153

capitalize, lowercase, uppercase

Question 154

what is the difference between uppercase and capitalize?

Answer 154

capitalize, capitalizes every word

uppercase capitalizes every letter

Question 155

how do we create a pseudo element?

Answer 155

selector/selectors :: pseudo element {

}

Question 156

how do we create a pseudo class?

Answer 156

selector/selectors: pseudo class {

}

Question 157

what is ::first-letter ?

Answer 157

is a pseudo element that allows you to put styles on the first letter of the first sentence of a block level element

Question 158

what should we keep in mind when we use ::first-letter?

Answer 158

That punctuation and special characters used before the first letter will also be stylized

Question 159

what is :hover?

Answer 159

this pseudo class allows you to stylize what happens when a user interacts with an element with a pointing device, but does not necessarily activate it. It is generally triggered when the user hovers over an element with the cursor (mouse pointer)

Question 160

what is the link to link an external css file?

Answer 160

(link rel=”stylesheet” type=”text/css” href=”name of file.css”)

Question 161

where do we put the link to the css style sheet?

Answer 161

in the head

Question 162

how do we make a css document?

Answer 162

open note pad or text editor, code up css, save as

nameOFdocument.css in all files

Question 163

how do you link a css page to a html page?

Answer 163

write out stylesheet link and place the name of the css file as the value for the href attribute

Question 164

how to render the html and css document once linked?

Answer 164

place it in a folder together and open up the html file, it should open up in the web browser rendering the css and html

Question 165

what should the first page of your website or the html you want to load be saved as?

Answer 165

index.html

the browser looks for this one first.

Question 166

what is inline styling?

Answer 166

inline styling is when you style directly into the html code itself

Question 167

why should you avoid inline styling?

Answer 167

because you cant use it on other elements, its a one and done - it only affects that specific line of code that you’re coding.

Question 168

what is the separations of concerns?

Answer 168

the separation of concerns is the division of using html for coding the structure and using css to code the presentation and not mixing the two

Question 169

what is internal styling?

Answer 169

internal styling is using a style tag in the html and then coding inside the style element the same way you would in a css file.

Question 170

why should we avoid using internal styling?

Answer 170

because it only styles that particular page, its not as extensive and flexible in usage like we want

Question 171

what is a reason that we would want to use internal styling?

Answer 171

to increase page load speed

Question 172

what is the best way to apply css to your html?

Answer 172

by using external stylesheets - this way you can multiple pages to your html documents and have full control over every aspect of your page

Question 173

in css, if there are two rule sets targeting a specific selector with conflicting rules how does the browser decide which one to render?

Answer 173

it chooses the rule with the higher specificity

HTML
body
div class=box
p

CSS
body.box p {
green}

.box p {
red}

the paragraph will be green because body.box p is more specific than .box p

Question 174

when we have conflicting rules what will we have to do to get our rule rendered?

Answer 174

make it more specific, add more div’s if you need to

Question 175

what to look for when you wrote a rule and its not rendering the way you think it should

Answer 175

1. misspellings
2. spaces or lack there of
3. execution of open/close brackets
4. quotations misused
5. value not set/initial value being none
6. rule with a higher specificity

Question 176

what are conditions in reference to css?

Answer 176

conditions are the steps that define specificity - the more conditions the higher the specificity.

for example :

body >main div.modal a {
}
this has 5 conditions and has a very high specificity

a{
}
this only has one condition and is of low specificity

the first rule set would override the second rule set

Question 177

the difference between conditions and selectors?

Answer 177

conditions are part of a selector, conditions specify a selector.

body, footer {
}

these are two separate selectors with one condition each, both of these have low specificity because neither body nor footer are being specified

body > main div.modal a, footer > div.mlb p {
}
these are two selectors with 4/5 conditions each

Question 178

what is the cascade?

Answer 178

a process browsers follow to determine which CSS values get applied for all the properties on a given element

Question 179

what trumps the cascade?

Answer 179

specificity

Question 180

if two rules have the same specificity and are targeting the same element which one gets rendered?

Answer 180

the one lower on the style sheet/or the one that was applied later

Question 181

What is the first step the browser takes to determine what styles to apply to an element?

Answer 181

1. Finds which rules apply to the element

Question 182

What is the second step the browser takes to determine what styles to apply to an element?

Answer 182

2. Takes all the relevant rule sets and sorts them by origin.

Question 183

What do we mean by “origin of a rule set”?

Answer 183

Inline style vs. internal vs. external

Question 184

In sorting the origin of a rule set what overrides others?

Answer 184

Inline styling - it overrides external and importance

Question 185

What is the third step the browser takes to determine what styles to apply to an element?

Answer 185

It takes all the rule sets that

Have the same origin and importance and sorts them by specificity

Question 186

What is the fourth step the browser takes to determine what styles to apply to an element?

Answer 186

If there are rule sets still conflicting that gave the same origin, importance and specificity ——

Then the browser takes the rule that’s declared last (lower on the style sheet)

Question 187

What does the keyword !important ? And what does it do?

Answer 187

It allows you to override other rules that might have been declared later in the stylesheet or in a different file.

Question 188

Typically if you have to use the keyword !important it is an indication of what?

Answer 188

there is something wrong with your style rules

for instance - you make just need to use a more specific selector

Question 189

what is the basic idea of the box model?

Answer 189

that all elements on a webpage are actually <b>rectangular boxes </b> even if they appear in a different shape or aren’t visible

Question 190

what are the 5 aspects of an element that make up its total space?

Answer 190

width
height
padding
border
margin

Question 191

what is width?

Answer 191

width is the length of the content area horizontally

Question 192

what is the content area?

Answer 192

The content area, bounded by the content edge, contains the “real” content of the element, such as text, an image, or a video player.

Question 193

what is height?

Answer 193

height is the length of the content area vertically

Question 194

what happens to height and width when box-sizing is set to border box?

Answer 194

both height and width go from defining the content area to the border area

Question 195

what is the border area?

Answer 195

the area bounded by the border and everything in it

Question 196

what is the formula to calculating the total space of an element?

Answer 196

width +
2x border +
2x padding +
2x margin =

total space

Question 197

Is it possible for the width and height of an element to be different than the one explicitly set in our code?

Answer 197

yes, absolutely. when you set a elements width and height, you are only setting the content area, adding padding and borders will all make it larger than what you have explicitly set

Question 198

how do we get the browser to respect the width and height that we set in our code?

Answer 198

add box-sizing: border-box to the element

Question 199

what do we do if we want all the elements in our code to have their width and height explicitly?

Answer 199

we use the universal selector
* {
box-sizing:border-box
}

Question 200

according to the box model, every element on the page is what? and has what 3 things?

Answer 200

is a rectangular box

and has

1. a height
2. a width
3. content

Question 201

where is the content in an elements rectangular box?

Answer 201

it is in the middle

Question 202

what is content surrounded by in its rectangular box?

Answer 202

by optional elements such as padding, border and margin

Question 203

what is the default width of a block element?

Answer 203

it is the length of the page

Question 204

what is the width of an inline element?

Answer 204

the length of the content

Question 205

which way do block elements flow?

Answer 205

top to bottom they will be on top of one another vertically

Question 206

what is the value name for the default of height and width?

Answer 206

auto

Question 207

what is the default height of an inline element?

Answer 207

the height of the content

Question 208

inline elements flow which way?

Answer 208

from left to right horizontally on the same line

Question 209

most of the time what is done with the height of an element?

Answer 209

its left default/undefined

Question 210

can we apply padding to any html element?

Answer 210

yes, we can

Question 211

can padding take a negative value?

Answer 211

no it cannot

Question 212

when you change the background color of the content area what happens to the padding area?

Answer 212

it changes to the same color as the content area

Question 213

Is margin taken into account when calculating the width and the height of an element?

Answer 213

No it is not, it is considered external space of an element, so we dont consider it apart of the height or the weight.

we do count it towards the elements total space though

Question 214

is margin every visible?

Answer 214

no its always transparent and takes the background image of the parent element

Question 215

do inline boxes (text boxes, links, etc) take up 100 percent of the parent element?

Answer 215

no they do not, their height and weight are generally the size of the content

Question 216

what is a replaced inline element?

Answer 216

it’s an element whose dimensions are set outside of the document and is linked to the page externally.

think images, videos etc.

Question 217

what is a non replaced inline element?

Answer 217

it is an inline element thats content is not external but entered into the document itself

Question 218

what tag do we use for a short quote into our html document?

Answer 218

the inline q tag

Question 219

what tag do we use for a longer quote?

Answer 219

the block element, blockquote

Question 220

what is the a css reset?

Answer 220

since different browsers have different default settings developers use CSS resets or CSS normalization to ensure a consistent experience across browsers

Question 221

what is the background-image property and how do we apply it?

Answer 221

it adds background images to a div

background-image: url( image source address);

Question 222

how do we adjust the size of a background image inside of a div?

Answer 222

we use background-size: and set the numerical value for the size with the width going first and the height following or using percentages or keywords.

Question 223

how do we make a background image repeat inside of a div?

Answer 223

we use background-repeat: repeat

or we can use :none; to stop it from repeating

Question 224

what does linear-gradient do?

Answer 224

it sets up a transition that allows the background of an element to go from one color to the next

Question 225

what is the syntax for a simple linear gradient transition?

Answer 225

background: linear-gradient( color , color);

this will set a transistion from one color to the next, this is no adjustment to direction, or transparency or where colors change or more than one color, or background image. Its the most basic linear gradient application

Question 226

what does an element need to have specified in it for a linear gradient to work?

Answer 226

a height

Question 227

what is radial-gradient?

Answer 227

it does the same thing as linear gradient, except its not on a linear line… it starts from the center and radiates outward a cyclicar fashion

Question 228

what does the gradient property work with?

Answer 228

the background property and the background image property, not the background-color property

gradient properties are considered an image

Question 229

the background property is shorthand for what?

Answer 229

background property and background image

Question 230

how many colors can you have inside of the parenthesis for a linear gradient property?

Answer 230

unlimited, just make sure to add a comma in between the colors

Question 231

can there be a space in between linear gradient and the ( )?

Answer 231

no there cant be

Question 232

what is the default direction of linear gradient?

Answer 232

it is top to bottom

Question 233

what is the default starting and finishing points for linear gradient with two colors?

Answer 233

1 color = 0% (is when its pure)
2 color = 100% ( is when its pure)

so for example :
linear gradient(red, yellow);

means that at
0% of the page (the very top) will be where it is pure red
and
100% of the page ( the very bottom) is where it will be pure yellow

Question 234

in linear gradient when does the transition of color start happening?

Answer 234

immediately, its starts to shift to the next color right away…

so a color thats pure at 0% will start to mix and transition with the next color at 1% and will continue that way until it becomes the next color and the process will repeat it self until the end of the document

Question 235

how do we specify that we want a color to remain pure until a certain part of the document before it starts changing?

Answer 235

you add a percentage after the color

so if you had linear-gradient:(green, yellow)
we know that the green is pure at 0%, but what if we wanted it to be pure for half the page until it started transition…. then you would put ….

linear-gradient:(green 50%, yellow)

this would make the green half the page and transition to yellow in the last half

Question 236

when dealing with linear gradient percentages labeling where they start and stop, do we need to put 0% and 100%?

Answer 236

no the 0 and the 100% are already implied as the start and end of the gradient line respectively

Question 237

do we have to use percentages when using gradients?

Answer 237

No we do not at all - we can use any measurement we want…px’s for example

Question 238

what if we wanted to colors to sharply divide between themselves? what if we didnt want a transition at all?

Answer 238

then you make them share the same stopping point…

for example
linear-gradient:(red 50%, yellow 50%) this will make a hard stop in the middle of the page and it will look half red and half yellow

same thing with any percentage or value, it doesnt have to be 50 percent

Question 239

how can we change direction of which way a linear gradient transitions?

Answer 239

you can add a direction inside the parenthesis, with a comma, before the colors

linear-gradient:(to top right, green, yellow);

Question 240

which directions can we apply to a linear gradient property?

Answer 240

to right, to left, to top, to top right, to top left, to bottom right, to bottom left

to bottom (default)

and you can add degrees if you wanted to get more specific

Question 241

what is the measurement in degrees for the default direction (to bottom) for the linear-gradient property?

Answer 241

180 degrees

bottom to top would be 0 degrees
left to right would be 90 degrees

Question 242

besides colors what can gradient property also support as if it was a color?

Answer 242

it can support transparent, which is used just like the a color, it can be used in transition, it can be made half the page.

consider it another color to use, whatever you put behind it will show

Question 243

do we need to add a second color to the linear gradient property if transparent is present inside the parentheses?

Answer 243

no, transparent works just like another color

Question 244

Can we use transparency to stack background images?

Answer 244

yes we can, we can make one part of the image transparent and then add a background image url after the closed parenthesis of the colors section and a comma

linear-gradient:(green, transparent 50%), url (image);

Question 245

how to use rgba syntax

Answer 245

1. place color make sure it works
2. delete color
3. type rgba
4. create parenthasis
5. add 4 zeros with commas inside parenthasis except for last
6. adjust r,g,b, and a

Question 246

what does rgba stand for?

Answer 246

red, green, blue and alpha - the zeros correlate to these colors and opacities

alpha - basically means transparency

Question 247

in the rgba setting for transparency (alpha) which is no transparency which is full transparency?

Answer 247

0 is full transparency, 1 is no transparency
and everything in between are levels so o

0.5 is half transparency

Question 248

when you use rgba’s instead of colors does every set of zeros get its own set of parentheses?

Answer 248

yes they do, separated by commas

0,0,0,) , (0,0,0,0

Question 249

when applying start and stop measurements to rgba’s do we need to add a comma between the parentheses and the number value?

Answer 249

no, the comma will go after the number value unless it is the end of the value otherwise put a semi colon

(0,0,0,0) 45% , (0,0,0,0) 30% ;

Question 250

when adding degrees or directional values to rgba’s do we still need to use a comma before the first set of parentheses?

Answer 250

yes when you add degrees or a direction use a comma as you would with a color

(45deg, (0,0,0,0) , (0,0,0,0);

Question 251

what you should keep in mind when trying to make stripes using linear gradient

Answer 251

colors appear in what order you place in the code, so in order to have clear defining stripes you cant just go orange black orange black because that will create a transition on one end or the other…. thats ok if that is the desired effect, but for clear cut stripes you have to
go

black orange orange black black orange orange black black etc

Question 252

what is repeating linear gradient?

Answer 252

repeating linear gradient is the easiest way to make stripes and other patterns without having to repeat over and over again the specific start and stop points

Question 253

can you place both start and stop points for a color at the same time?

Answer 253

yes just add the start and stop percents before the comma as you would the start point

brown blue 25% 50 % red 50% 90% green

blue will start a quarter in and end half way throught the page and then red will take over until it reaches 90 percent and then green will take over

blue and green dont need values because 0 and 100 are always implied

Question 254

what degrees do we need to make it if we wanted to flip the order of 45 degrees when doing a linear gradient?

Answer 254

make it 225 degrees

Question 255

when adding multiple selectors in css what does no spaces between conditions mean as opposed to a comma?

Answer 255

think about it like this:

no space = and
comma = or

.foo.bar = means all elements with .foo AND .bar will get targeted

.foo, .bar= means all elements with EITHER .foo OR .bar will get targeted

Question 256

what do the pseudo elements ::after and ::before do?

Answer 256

they allow you to add content before or after your element

Question 257

when using ::after or ::before what else do you need to render content?

Answer 257

you need to use the content property

content : “what you want added here”

Question 258

how do you create smart quotes?

Answer 258

Use ALT+0145 and ALT+0146 for the left and right single quotation mark or apostrophe, respectively.

Use ALT+0147 and ALT+0148 for the left and right double quotation marks, respectively.

Question 259

how to get rid of the bullet points or numbers in a ul or an ol?

Answer 259

list-type: none

Question 260

what are 5 of the most common pseudo elements for styling anchors (a) tag?

Answer 260

link, visited, hover, focus and active

Question 261

what does visited pseudo element do?

Answer 261

it allows you to style how a link look once its been clicked and the website to the link has been visited

Question 262

what does the link pseudo element do?

Answer 262

it allows you to style how a link look before its been clicked

Question 263

what does the pseudo element hover do?

Answer 263

it allows you to style how an element looks when you hover the cursor or the mouse over it but not activate it

Question 264

what does the pseudo element focus do?

Answer 264

it allows you to style how a link or button looks when you keyboard focus on it

Question 265

what is keyboard focus?

Answer 265

keyboard focus is when users of only a keyboard click on tab and shift + tab to cycle through clickable options on a page along with the directional buttons….when this is activated the clickable items on a page will highlight

Question 266

what does the pseudo element active do?

Answer 266

active is while you’re clicking on a link, not before and not after the moment during. Active allows you to style this aspect of it

Question 267

what are radio buttons ?

Answer 267

they are small buttons that allow you to select one option at a time…great for multiple choice questions

Question 268

what are attribute selectors?

Answer 268

using css to target specific attributes and values, regardless of what element they are on

Question 269

how to target an element by its attribute?

Answer 269

element[attribute]{

}

Question 270

what happens when you add a title attribute to an element?

Answer 270

when you hover over it - what ever value you add to the title attribute will come up

Question 271

what does the button tag do ?

Answer 271

the button tag creates a button

Question 272

what are the three main values for the button tag?

Answer 272

submit = that enters information 
reset =  resets all controls to their initial values
button = doesn't do anything, just acts a place holder

Question 273

what is the main attribute to be used with button tag?

Answer 273

type

html example

button type= submit

Question 274

how to target a attribute and value?

Answer 274

[attribute=”value”][
}

example
button[type=submit]{
color: red}

Question 275

how to target an element by one keyword anywhere in the value?

Answer 275

[value ~=”keyword”]{
}

this word has to be surrounded by blanks in order to be recognized because spaces count as characters

Question 276

when targeting attributes and values is adding the element necessary?

Answer 276

its not necessary for it to work, but it may become necessary once you start working on bigger projects with lots of code

Question 277

how to target attributes that have a specific keyword in the beginning of it ?

Answer 277

[attribute^=”keyword”]{

}

Question 278

when is a time you might want to target particular values that all start with the same keywords?

Answer 278

when youre targeting a href links, for example if you want to target all the ones that start with http as opposed to something found locally on a computer

Question 279

how to target an attributes that have specific keywords in the end of their value?

Answer 279

[attribute$=”keyword”]{

}

Question 280

when is a time you want to target particular values that all end with the same keyword?

Answer 280

if you wanted to target all links that ended with .com as opposed to .gov

Question 281

how to target an attribute that has a specific collection of characters anywhere in its value?

Answer 281

[attribute*=”characters”]{
}

usually words not surronded by spaces

this doesnt have to be full words, if you put econ in there it wont just look for econ, it will look for it in between other words as well

so the word second for example would count because it has the combination of characters of “econ” in it

Question 282

when targeting attributes that have a specific collection of characters anywhere in its value, do spaces count as characters?

Answer 282

yes they do, the value of “ird h”

would work for “third helping”

but not “thirdhelping”

the spaces count as characters

Question 283

how do you rotate an image?

Answer 283

transform: rotate(deg)

Question 284

what is the lang attribute?

Answer 284

it goes on the html attribute and sets the language for the web page _ this allows screen readers read it in the appropriate language

Question 285

what is the display property?

Answer 285

the display property determines how the elements box is rendered in the browser

Question 286

what is an inline element?

Answer 286

it is an element that does not start on a new line and its height and width are that of its content. In line elements go left to right

Question 287

what is a block element?

Answer 287

it starts on a new line, and its height and width can be expressily set

Question 288

why should we set max width property for paragraph elements?

Answer 288

because people dont like to read really wide paragraphs so using max width is a common practice

Question 289

block elements width is set to what default?

Answer 289

it will take up the entire width of the parent element it is under.

Question 290

If inline elements go left to right, and block elements go on top of one another, how do we get block elements to go left/right or side by side?

Answer 290

by turning them into inline block elements

Question 291

how do we make a block element an inline block element?

Answer 291

by adding the property and value of

display: inline-block;

Question 292

how do you remove the white space that occurs between a set of inline block elements?

Answer 292

setting font-size to 0 on the parent of a set of inline block elements removes white space between them.

Question 293

what happens when you put two inline elements one after the other on different lines?

Answer 293

the browser renders the line break as just a space and puts the two inline elements on the same line

Question 294

can you set inline elements to behave like block elements and vice versa?

Answer 294

yes you can. this is a good strategy when you want to use a particular element because it is semantically correct, but its default display is not what your designs call for.

Question 295

what is a common place you will see a block element changed into a inline element

Answer 295

links that appear in a nav bar. By default, both unordered lists and list items are block-level elements, but by setting their display property to inline-block, you can get them to display side- by-side in the nav.

Question 296

how do we center horizontally a block element?

Answer 296

by adding
margin-left: auto
margin -right: auto

Question 297

when you use margin-left: auto and margin-right: auto the block level element gets put in the center of what?

Answer 297

the parent element

Question 298

how do we horizontally center a inline element inside of a block element?

Answer 298

text-align: center;

Question 299

can we use text-align to move non text inline elements?

Answer 299

absolutely, for example you can use it for images

Question 300

when creating like features on a page that are similar but will be different, what can you do besides adding extra classes?

Answer 300

add names to the class name

instead of 
div class = design 
          div = top row 
                   div= box 1 
                    div = box 2

you can eliminate the top row div by simply going

div class=design
div = top box 1
div = top box 2

Question 301

what are forms?

Answer 301

forms are containers that hold a set of inputs

Question 302

what are inputs?

Answer 302

are individual components that a user interacts with - typically corresponding to a single data point. HTML provides numerous input types (text, email, number, password, etc.)

Question 303

what is the form tag?

Answer 303

the form tag wraps all of the labels and inputs.

think of it as the html element of the form, everything has to go inside of it

Question 304

what do you want to make sure that you set on a form tag?

Answer 304

the method and action attributes

Question 305

why must we ensure that we set the method and the action attributes in a form tag?

Answer 305

This will ensure user input can be submitted even if JavaScript is disabled or breaks.

Question 306

what is the action attribute in a form tag do?

Answer 306

The action attribute is the URL of the server endpoint that submitted form data should be sent to

Question 307

what is the method attribute in a form tag do?

Answer 307

The method attribute is the request method that the browser should use when sending the data to the server.

Question 308

what are the two methods you can use in a form tag?

Answer 308

method=”post”
and
methos=”get”

Question 309

what is the method we are mostly going to use at this point in time in a form tag?

Answer 309

we will use the post method

Question 310

what is the fieldset tag?

Answer 310

The fieldset element is used to group together related inputs and labels such as contact info, employment history etc

Question 311

what to remember about fieldsets?

Answer 311

they have default styling that you might have to override

Question 312

what is the point of the fieldset tag and its default styling?

Answer 312

they help web crawlers and screen readers understand how inputs are grouped together (even if this is not revealed visually to sighted users).

Question 313

what is the legend element?

Answer 313

he legend element is like a title for the fieldset. For screen readers, it adds extra context to the inputs in the fieldset. For instance, when a screen reader user arrives at the “First name” input, they will hear something like, “First name, edit text, Contact info”.

Question 314

when we have single input for a single topic do we need to use fieldset tag?

Answer 314

no, the point of fieldsets are to group sets of input together so they dont serve much benefit if there is only one possible input

Question 315

what is an example of a top with only one input?

Answer 315

if you have a single question with multiple choice answer. there single answer will only be one input, so if this is all you have then there would be no point in making a seperate fieldset tag

Question 316

if we have one input for one topic, what should we use instead of a fieldset?

Answer 316

just use a label, one label for one topic is enough

Question 317

what are type=text inputs?

Answer 317

they are inputs that accept text

Question 318

what does a label tag do?

Answer 318

a label tells humans and webcrawlers and screen readers what an input is for

(label for=”first-name”)First name (/label)

Question 319

what attribute do you need to use with the label tag ?

Answer 319

for=

Question 320

what should you set for the value of the “for” attribute on the label tag?

Answer 320

it should be the ID of the value that the input is for

label for=”first-name”)First name (/label
(input id=”first-name”)

Question 321

do label tags need a closing tag?

Answer 321

yes they do

Question 322

do input tags need a closing tag?

Answer 322

no they dont

Question 323

why should you set the value of the “for” attribute to the ID of the input element?

Answer 323

because label association wont work without it

Question 324

what does label association do ?

Answer 324

This association is what makes inputs take focus when you click on their labels, as we mentioned above.

Question 325

can you wrap the input element in the label element?

Answer 325

yes you can,

label)First name
(input id=”first-name” type=”text”
(/label)

Question 326

what must you do if you want to wrap the input tag inside the label tag?

Answer 326

omit the for attritbute

label)First name
(input id=”first-name” type=”text”
(/label)

Question 327

how does wrapping an input element in a label element affect a right margin?

Answer 327

if you set a right margin on a label wrapping an input, that margin right will appear to come after the input, not the label.

Question 328

what is a placeholder attribute on an input element?

Answer 328

placeholder is used to set text that initially displays before the user has input any data. Typically, placeholders are used for example entries, and usually, they’re styled to be lighter than user input text

Question 329

can we placeholders in place of labels?

Answer 329

Because they are meant to offer examples of desired input, they should not be used in place of labels.

Question 330

what is a required attribute on a input element?

Answer 330

indicate that an input must be filled out

Question 331

what is the pattern attribute on an input element?

Answer 331

is used to supply regular expression patterns that the user’s input must match in order to be valid.

For example, we can use this to require that the phone number entry consists of only numbers, and optionally dashes.

Question 332

what is the type attribute do on an input element

Answer 332

his attribute determines how the element looks and how its validation works. For instance, an input with type=’email’ will be valid if the user inputs text that has an @ with text before and after.

Question 333

what are some ways that input types affect accessibility?

Answer 333

Input types also provide some accessibility by dictating the kind of keyboard a smartphone will display for a user: number inputs will show only the number pad; email inputs will show a keyboard with the @ symbol in a prominent place.

Question 334

how do we get a “pick one and only one” behavior from inputs of a radio type?

Answer 334

you use the same “name” attribute with the same value on all the options

Question 335

what is the select element?

Answer 335

the select element is used much like the ul/ol element - it provides a list of options to choose from

Question 336

what is the option element?

Answer 336

are individual options - they work much in the same way li’s do - they are wrapped in a select element

Question 337

how do we preselect an option in a form?

Answer 337

add the attribute selected in the opening tag of the option element

Question 338

what is the optgroup element?

Answer 338

it is a way to group large amounts of options under a given name, this is used to large lists of options

Question 339

what should you always remember about designing forms?

Answer 339

keep them short and simple and to the point, the longer and more convoluted they are - the less likely someone will finish them. which is the point of a form in the first place.

Question 340

how do you disable the default stylings set for the fieldset element?

Answer 340

fieldset {
  padding: 0;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0;
  border: none;

Question 341

what is the position property mainly about?

Answer 341

its mainly about the flow of the element in a html document

Question 342

what are the 4 most common values for position property?

Answer 342

static, fixed, relative and absolute

Question 343

what is the default setting for the position property?

Answer 343

static

Question 344

what is static value mean?

Answer 344

means the element will have normal flow

Question 345

what is normal flow?

Answer 345

block-level elements get rendered in the same order that they appear in the HTML markup, one on top of another, starting from the top left corner of the document, and inline elements stretch as wide as their inside content (usually text).

Question 346

what is the fixed value mean?

Answer 346

When an element’s position is set to fixed, it will stay in place even when the user scrolls. Fixed elements are taken out of the normal flow, and other elements will position themselves as if the fixed element does not exist

Question 347

an example of a good time to use a fixed value

Answer 347

For navbars or footers that you want to remain stuck to the top or bottom of the screen, this is often the best approach.

Question 348

what is the viewport?

Answer 348

the area of a browser’s window in which web content can be seen

Question 349

what are the four offset properties?

Answer 349

top, bottom, left, right

Question 350

what elements can the offset properties be set to?

Answer 350

to elements that have been set to fixed, absolute or relative

Question 351

what elements can offsets not be set to?

Answer 351

elements set to static, or elements not defined (which are static because static is the default)

Question 352

how do you set which direction you want your element to go using offsets?

Answer 352

you want to put the numerical value according to where you want the element to move away from - not in the direction in which you want it to go.

if you want to make something 20px’s from the top you but top:20px

Question 353

what is the relative value?

Answer 353

the relative value is also in normal flow but you can set the offsets such as left right top and bottom

Question 354

When an element is set to relative does it affect the positioning of any other elements?

Answer 354

no it doesn’t, all the other elements act as if the element is not offset

Question 355

what is the absolute value?

Answer 355

absolute elements are outside the normal flow and can be offset, but unlike fixed elements, they are offset in relation to the first parent container with a non-static position.

Question 356

what is a common use of the absolute value?

Answer 356

A common use case for absolute positioning is when you have a navbar where you want to align a logo to the left and a set of links to the right,

Question 357

what should we keep in mind about elements with an absolute positioning ?

Answer 357

it will be a child of another element so it will start inside of another element and will be moved and location in relation to that parent element

Question 358

what is the primary use for the float property?

Answer 358

to wrap text around an image or any other container

Question 359

what happens when we apply float to an image?

Answer 359

it takes it out of normal flow and pushes it to whatever direction you set the value to

float: right will push the images to the right and the text will wrap around it to the left

Question 360

what happens when you have more than one floated element next to each other?

Answer 360

they stack horizontally provided there is space left in the parent element?

Question 361

what happens if you have multiple floated elements next to each other but there is no more room in the parent element for them to stack horizontally?

Answer 361

they will go on to the next line

Question 362

what is the clear property?

Answer 362

the clear property allows an element that does not recognize that is next to a floated element that it is next to one and moves it to the next available line

Question 363

when do we need to use the clear property?

Answer 363

since float takes elements out of normal flow, elements around it will behave as if they are not there, so sometimes other elements will be on teh same line as floated elements, adding clear to the elements on the same line as the floated elements will move them off the same line

Question 364

when you create a nav element, what is the first thing you should put in there before anything else?

Answer 364

links or a div containing links - anything else creates a white space between the nav bar and top of the page

Question 365

how do you get rid of underlines on a link?

Answer 365

add the property and value

text-decoration:none;

Question 366

when taking the underline off of links can you take them off in a group?

Answer 366

no you have to apply the text -decoration: none; separately

Question 367

how can you adjust the spacing between letters in a word?

Answer 367

with the letter-spacing property

Question 368

can negative properties be used with the letter spacing property ?

Answer 368

yes you can, this makes the space smaller?

Question 369

what to do when border radius makes your edges look boxy?

Answer 369

instead of using percentages use pixels instead

Question 370

how to specify a particular class of links to change the font?

Answer 370

put the element name before a:link

parent a:link

Question 371

what is a responsive layout?

Answer 371

it is a layout that responds or adjusts to the size of the screen

Question 372

how do we use flexbox?

Answer 372

define a flex container by using with the css property display: flex

Question 373

what can be made into a flex container?

Answer 373

any element on a html page including the body

Question 374

what are flex items?

Answer 374

all direct children of a flex container

Question 375

what items will be arranged by flexbox?

Answer 375

flex items

Question 376

what are the two ways in which a flex box is managed?

Answer 376

by specifying the behavior of the flex box or specifying the behavior of the flex items

Question 377

what 3 main properties control a flex container?

Answer 377

flex direction:
justify content:
align items:

Question 378

what is flex direction?

Answer 378

describes the main axis of the container.

Question 379

what is the main axis?

Answer 379

the line that goes through a document in which content is laid out…..if the main axis is set horizontally, the content will go left to right or right to left… if the main axis is set vertically, the content will go top to bottom or bottom to top

Question 380

regardless of flex direction what does every flex container have?

Answer 380

a start and an end

Question 381

by default how are items added to the flex container?

Answer 381

from the start of the container towards the end

Question 382

what 4 values does flex-direction take?

Answer 382

Row
row-reverse
column
column-reverse

Question 383

what is the row value do?

Answer 383

items are laid out from left to right

Question 384

what is the default for flex direction?

Answer 384

row

Question 385

what does the value row-reverse do?

Answer 385

items are laid out from right to left

Question 386

what does the value column do?

Answer 386

items are laid out from top to bottom

Question 387

what does the value column-reverse do?

Answer 387

items are laid up from bottom to top

Question 388

what is justify-content?

Answer 388

it describes how items are arranged on the main axis

Question 389

what three positional values for the justify content property?

Answer 389

center
flex-start
flex-end

Question 390

what do the positional values center, flex-start and flex-end used for?

Answer 390

hese specify how elements are packed in the container, from the center, start or end respectively

Question 391

when can you use the additional values space-between,

space-around and space-evenly for justify content?

Answer 391

when you have more than one item in the flex container

Question 392

what do space-around, space-between and space-evenly do?

Answer 392

Each of these describes how to distribute the extra space not taken up by the items themselves.

Question 393

what is the cross axis?

Answer 393

the cross axis is the axis perpendicular to the main axis.

Question 394

what is the align-items property?

Answer 394

it is used to adjust how items are laid out along the cross axis

Question 395

what positional values can you set to the align-items property?

Answer 395

you can also add

center,
flex-end
flex-start

Question 396

can justify content and align items be used on the same container?

Answer 396

yes justify content adjusts location of content on main axis.
align items adjusts location of content on cross axis

Question 397

what is the align-self property?

Answer 397

this allows you to adjust an individual item in the flex container - you add it to the item itself in css

Question 398

what values does the align-self property take?

Answer 398

same as align items and justify content

center,
flex-end
flex-start

Question 399

when creating a design should you design with mobile devices in mind first or computers?

Answer 399

you should design for mobile first and adjust off that

Question 400

what is graceful degradation?

Answer 400

process of creating a layout where you start with the most complex layout and as many features as you like, then try to remove features and rearrange elements to fit on a smaller screen. This approach is known as graceful degradation.

Question 401

what is progressive enhancement?

Answer 401

design the page to work on the smallest screen first, then progressively add features and rearrange the layout to take advantage of the larger screen sizes

Question 402

what is progressive enhancement also known as?

Answer 402

mobile first design

Question 403

how to inspect what a website will look like on a mobile phone but on a computer using dev tools?

Answer 403

Choose a page, and open DevTools. Make sure you’re on the “Elements” tab. At the top left, right by the list of tabs, you’ll see an icon to “Toggle device toolbar”. Click it.

Question 404

should you 100 percent use chrome dev tools to see how your web page looks on a device?

Answer 404

no because they arent a 100 percent accurate, you should always check on an actual device if you can -but dev tools is good if you dont have an available device

Question 405

what is a media query used for?

Answer 405

to create different styles for different screen conditions

Question 406

what does a media query consist of?

Answer 406

a media type and any number of media features

Question 407

what is the basic syntax for a media query?

Answer 407

@media (media type) () {
(CSS Rules)
}

Question 408

what can be set as media types?

Answer 408

all, print, screen, or speech

Question 409

what are some popular media features that a media query can be set to?

Answer 409

The list of media features is long but a few examples are:

width
height
orientation
color

Question 410

what is a burger icon?

Answer 410

a burger icon is the three thick horizontal lines that signify a drop down menu on mobile apps

Question 411

do we use traditional nav bars on mobile devices?

Answer 411

its customary to use a burger icon to create drop down nav apps on mobile devices

Question 412

What is the break point?

Answer 412

The break point the point in which we want to modify the layout from the mobile design to the large design

Question 413

How do we find the break point?

Answer 413

Start with a smallest screen size and then slowly increase the width until the layout:

1. Starts to look awkward
2. Has enough space for a horizontal layout

Question 414

what is flex-grow:?

Answer 414

specifies how items grow relative to each other to occupy available space

Question 415

what is flex-basis:?

Answer 415

sets the initial size of an item in a flex -container

basically it sets the width of an item in a flex container and is the starting point from which flex grow and flex shrink take place

Question 416

what is flex-shrink?

Answer 416

tells how much an item shrinks when put into a smaller viewport

Question 417

what are the values for flex-grow and flex-shrink?

Answer 417

1-3

Question 418

what is the value of flex-basis?

Answer 418

a distance ie something measured in px’s or something similar

Question 419

what is the shorthand for the flex properties?

Answer 419

flex:

Question 420

how can the flex values be consolidated?

Answer 420

grow- shrink- basis

flex-grow: 0;
flex-shrink: 0;
flex-basis: 120px;

can become

flex: 0 0 120px;

Question 421

what does space-between do ?

Answer 421

this evenly dispurces the space evenly between items - but pushes items along the borders

Question 422

what does space around do?

Answer 422

this puts the equal amount of space around an item on both sides, so these items will be pushed off the side of the border of the container

Question 423

does space around look equally spread out?

Answer 423

no it will not look equally spread out, items in the middle will look like they have more space because the space that is divided equally is going on the sides of the items ….so two items next to one another both have space assigned to them so it will look like double space in between them where along the edges there will be a single space

Question 424

what does space evenly do?

Answer 424

items are distributed so that the spacing between any two items and the space to the edges is equal

Question 425

does a flex container naturally wrap to the next line?

Answer 425

no it doesn’t , it is naturally set to no wrap, so everything in a container will go along the main axis forever and ever until there is no content

Question 426

how do we get a flex container to wrap?

Answer 426

flex-wrap:

Question 427

what are the values for flex-wrap:?

Answer 427

nowrap, wrap, wrap-reverse

Question 428

how to center all items along the cross axis in a flex container?

Answer 428

add align-items:center; to the flex container

Question 429

what is javascript?

Answer 429

its a piece of software that lives inside your browser that can control its environment and do lots of different things

“the implementation of the ecma script standard”

Question 430

What is the v8 engine?

Answer 430

it is the most popular version of Javascript

Question 431

what is the ecma script?

Answer 431

is the standard/uniform regulations that make up javascript.

like how all cars have a steering wheel and gas is on the right and brake is on the left ….all of these are standards

Question 432

what are the two things ecma script define?

Answer 432

the engine and the language

Question 433

what are variables used for?

Answer 433

are used to create and represent data in our applications

Question 434

what do you use when you want to create data?

Answer 434

a variable

Question 435

what do you use when you want to make data do something what do you use?

Answer 435

functions

Question 436

what are 7 of the basic data types that javascript understand?

Answer 436

number
string
boolean
null
undefined
symbol
objects

Question 437

can we create custom types of data?

Answer 437

yes of course

Question 438

whats the difference between undefined and not defined?

Answer 438

not defined is when the engine cannot find the variable name, undefined is when the engine can find the variable name but cannot fine a value associated with it

Question 439

when a user doesn’t give a variable a value, what is the initial value of all variables in the ecma standard?

Answer 439

undefined

Question 440

what is a var keyword?

Answer 440

var sets a variable

var x = 3

Question 441

if we intentionally want to not set a value for a variable, should we set it to undefined?

Answer 441

No, in general we should set it to null and let the engine tell us when something is undefined, this way we know that we forgot to set a variable and need to go back into our code and set a value for something

Question 442

what are complex data types?

Answer 442

functions, arrays and custom data types

Question 443

at the end of the day what category of basic data types do the complex data types fall under?

Answer 443

they fall under objects, they are just objects with special features.

like function is an object that does something

Question 444

what does calling a function mean?

Answer 444

it means calling it to perform the action that you set it to do

Question 445

what is the syntax of calling a function?

Answer 445

identifier( )

example:

kick( )

Question 446

What is the if/else block?

Answer 446

If - is used to specify a type of code to be executed if the the condition is true

Else - is used to specify a type of code to executed if the condition is false

Question 447

What is the information between curly brackets known as?

Answer 447

A block

Question 448

Are there conditions where you just use the conditional “if”?

Answer 448

Yes

Question 449

What is the else if conditional?

Answer 449

It’s a way to specify a new condition to test if the first condition is false

Question 450

What is a switch statement?

Answer 450

A way to specify many different alternative blocks of code to be executed depending on the condition

One way to keep code clean instead of writing a million different else if conditions

Question 451

What is an operator?

Answer 451

Operators are used to assign values, compare values

Question 452

What are the basic categories of operators?

Answer 452

Arithmetic 
Assignment 
String
Comparison 
Logical
Ternary

Question 453

What does typeof keyword do?

Answer 453

Tells you the day type of a value

Question 454

what is the difference between var and let?

Answer 454

let is the newer in date version. Var is the old version, don’t use it anymore

Question 455

what is the difference between let and const?

Answer 455

let names a variable that can be changed at any time

const names a variable that will not be changed

Question 456

what is the syntax for creating a const?

Answer 456

const identifier = value

const myBirthday = 71086

Question 457

what happens if you try to reassign the value to a previously set const?

Answer 457

it will come back as an error

Question 458

what is the assignment operator?

Answer 458

it is the equal sign, it assigns a value to an identifier

Question 459

can we assign an identifier name without giving it a value?

Answer 459

yes, by using let or var

let myBirthday;

Question 460

can you assign an identifier name without giving it a value using const?

Answer 460

no you cant.

Question 461

how do you later assign a value to an identifier without a name?

Answer 461

identifier = value

Question 462

what will be assigned as a value to a identifier that hasn’t been defined by the developer?

Answer 462

undefined

Question 463

what are reserved words?

Answer 463

reserved words are words that are already stored with meaning in a program language that cant be used as a variable name a keyword or a identifier

for example you cant use var var = 3

var is already assigned and understood by the engine

Question 464

exception to the rule when using reserved words in a variable name

Answer 464

you can use a reserved word inside of a variable name

for example

you can use var varname = 4

although it would be redundant

Question 465

character restrictions in using variable names

Answer 465

every variable has to begin with an upper or lower case letter an _ or a $

Question 466

where in a variable name can you use numbers?

Answer 466

in the middle or the end, anywhere but the beginning

Question 467

can spaces live in the variable name?

Answer 467

no, no spaces anywhere

Question 468

can comparison or logical operators be used in variable names?

Answer 468

no not at all

Question 469

what are stylistic restrictions when making variable names?

Answer 469

they are restrictions that if you dont follow will not break your code, but it will cause it to look funny and hard to read for other coders or developers working on your program.

Question 470

what technique should we use when we are creating variable names?

Answer 470

camel-casing

Question 471

what is camel casing?

Answer 471

camel casing is when you start with a lowercase word and then every word after that has the first letter capitalized

Question 472

when choosing a name for the variables what should we do?

Answer 472

when we choose variable names in JavaScript, we should choose names that reflect how the variable gets used in the program. A well-chosen variable name can help other people reading the code to understand how the variable is intended to be used.

Question 473

how can we ensure that we dont use global variables?

Answer 473

we can assign strict mode at the top of our java file

this is recommended to be used at the top of all your java files unless you have a reason not to

Question 474

how do we apply strict mode to our java file ?

Answer 474

‘use strict’;

Question 475

what is an integer number?

Answer 475

a whole number with no decimals

Question 476

what is a float number?

Answer 476

a number with a decimal

Question 477

what is null?

Answer 477

null is a special value used to indicate that a variable has no value

Question 478

when you use typeof on null what comes back?

Answer 478

it comes back as an object, this is a mistake in javascript that hasnt been fixed in the new version

Question 479

what are booleans?

Answer 479

they work with conditionals using one type of code if a value is true and another type if it is false

Question 480

what does the ! signify in a boolean?

Answer 480

it inverts the true and false value
so !true evaluates to false
and
!false evaluates to true

Question 481

what is coercion?

Answer 481

this is when you use an operator to combine two different data types java will force them together in one data type

Question 482

what does the built in alert function do in javascript?

Answer 482

it takes the text you put inside the parentheses and puts in a pop up window when activated

alert(‘Hello from JavaScript Land’);

Question 483

what is a parameter?

Answer 483

it is the variable that holds the place for an argument

Question 484

what is alerts main responsibility?

Answer 484

display a pop up window to the user with a message in it

Question 485

How many arguments does alert take?

Answer 485

One. the text you want to appear in the window

Question 486

what does determinate mean?

Answer 486

Given the same inputs on separate invocations, the result should be exactly the same. No matter what else is happening in your program

Question 487

when we define a function does it automatically run?

Answer 487

defining a function and calling/invoking it are separate things, and when you define a function, the code isn’t automatically run

Question 488

if you create a function to multiply only two numbers and you add more than two numbers when you run the code what will happen?

Answer 488

it will run the function as you asked only taking into account the first two numbers you placed, it will act as if the other numbers aren’t there. It wont break the code or show up as an error but it will not compute them either

Question 489

what does parse mean?

Answer 489

when a browser reads code

Question 490

what are fat arrows?

Answer 490

=> <=

Question 491

how can we use fat arrows to create a function with a function expression?

Answer 491

const add = (num1, num2) => num1 + num2;
add(2, 3); 

this would be the same as

const addAlt = function(num1, num2) {
  return num1 + num2;
}

Question 492

if creating a multi line function with fat arrows, what two things do we need to make sure we include?

Answer 492

you need to add curly brackets around the action part of the code.

and if the code is meant to return a value, add the keyword return.

const add = (num1, num2) => {
  console.log('Adding', num1, num2);
  return num1 + num2;
};

Question 493

do fat arrows need parameters when used to make functions?

Answer 493

no they don’t need parameters simply use empty parens followed by the arrow

const alertMe = () => alert(“You’ve been alerted!”);

Question 494

what are parens?

Answer 494

they are short hand for parenthesis

Question 495

When defining a arrow function that has a single parameter do we need parens?

Answer 495

When defining an arrow function that takes a single parameter, the parentheses are optional:

const isEven = num => num % 2 === 0;

// same as

const isEvenAlt = (num) => num % 2 === 0;

Question 496

what is concatenation?

Answer 496

JavaScript lets us use the + operator to concatenate — which just means “connect” — 2 strings into a bigger one.

Question 497

what is the difference between concatenation and coercion?

Answer 497

concatenation is two strings being connected together, coercion is when two different data types are made into one

Question 498

what if you wanted to use double quotes inside a string that is already using double quotes to say it is a string?

Answer 498

you add a back slash before the inner quotes

const heSaid = "He said, \"Foo!\"";
console.log(heSaid); // => He said, "Foo!"

Question 499

what does \t do inside of a string?

Answer 499

creates a tab sized space in between the two words

Question 500

what does \n do inside of a string?

Answer 500

it put what comes after it on a new line

Question 501

what is the maximum character count you should have on one line of code?

Answer 501

80 characters

Question 502

if you have a string that is longer than 80 characters what two things can you do?

Answer 502

1. you can add a \ and continue it to get it to go to the next line.
2. you can close the string and add a + and start another string on the next line

const element = '<p>The quick brown fox jumps over the lazy dog. The \
  quick brown fox jumps over the lazy dog. The quick brown fox jumps over \
  the lazy dog.</p>';

<b> same as: </b>

const element2 = '<p>The quick brown fox jumps over the lazy dog. The quick ' +
  'brown fox jumps over the lazy dog. The quick brown fox jumps over the ' +
  'lazy dog.</p>';

Question 503

how can we use === with strings?

Answer 503

we can use it to compare to see if they are identical

const string1 = 'foo';
const string2 = 'foo';
const string3 = 'bar';

string1 === string2; // => true
string2 === string3; // => false

Question 504

What are Template strings?

Answer 504

Template strings give us a way to refer to variables and execute JavaScript code inside of a string

Question 505

How do you indicate a a template string?

Answer 505

Template strings are indicated by surrounding text between opening and closing backticks (`).

Question 506

How do you execute code inside a template string?

Answer 506

Inside a template string, you can refer to variables or execute code by using ${}.

Question 507

What are regular strings full name?

Answer 507

Literal string

Question 508

If using literal strings to write html what would you need If adding more than one line?

Answer 508

you would have to use concatenation (with +) to keep it looking neat.

const badArtTips = (
  '<p>How to draw an owl:</p>' +
  '<ul>' +
    '<li>Draw a circle</li>' +
    '<li>Draw the rest of the owl</li>' +
  '</ul>'
);

Question 509

When using template lines to write html do we need to concatenate?

Answer 509

With template literals, we do not need to concatenate.

const badArtTips = (
  `<p>How to draw an owl:</p>
  <ul>
    <li>Draw a circle</li>
    <li>Draw the rest of the owl</li>
  </ul>`
);

Question 510

what are the two different forms of the data type “numbers”?

Answer 510

integers and floats

Question 511

What are arithmetic operators ?

Answer 511

they are operators that can manipulate numbers

Question 512

what are the 6 arithmetic operators?

Answer 512

addition
subtraction
multiplication
division
exponentiation
remainder

Question 513

what do compound operators allow us to do?

Answer 513

They allow us to change the number value of variable and save the new value to the variable

counter = 1
counter += 9

This will make the variable have a new value of 10

Question 514

what does ++ signify when using number data types in JS?

Answer 514

it increases the value by 1

Question 515

where can ++ be placed on the data type name?

Answer 515

either before or after

++ counter
counter ++

are both valid

Question 516

whats the difference between the postfix and prefix ++ operators?

Answer 516

when you make it the value assigned to another variable name the value of the new the variable will be the same as the original for the postfix ++

in the prefix ++ both the new variable name and the value will be increased by 1.

x = 1 and y = 1

prefix =  ++x
postfix = y++

the result will be 
prefix = 2
x = 2
postfix = 1
y = 2

in the prefix the incrementation happens before a value is returned, in the postfix the incrementation happens after the value is returned (meaning the new variable name will have the same value as the original value before incremenation was rendered

Question 517

what is the order of operations in JS?

Answer 517

PEMDAS

Question 518

what is >=

Answer 518

greater than or equal to

Question 519

what is ===

Answer 519

equal to

Question 520

what is !==

Answer 520

not equal

Question 521

what to remember about the % operator

Answer 521

that it is a operator and isnt apart of the value. You use it the same way you would use the addition or multiplication sign

Question 522

what to remember about using pemdas

Answer 522

make sure that you are using parens correctly to accurately write your code

Question 523

What does double ampersand mean and what is it used for?

Answer 523

it means “and”

double ampersand evaluates to true if the values on both sides of the operator evaluate to true

Question 524

what does the boolean function do ?

Answer 524

Boolean function, which is used to convert a value into either true or false

Question 525

What are “falsy” values?

Answer 525

the values other than false that evaluate to false when coerced to a boolean):

Question 526

what values are “falsy”?

Answer 526

Boolean(false);
Boolean(""); // empty string
Boolean(0);
Boolean(null);
Boolean(undefined);
Boolean(NaN);

Question 527

If a boolean doesnt have a falsy value inside of its parens then what value does it return?

Answer 527

a true

Question 528

what does || mean and what does it do?

Answer 528

it means “or”

|| evaluates to true if one of the values evaluate to true.

Question 529

What does ! do?

Answer 529

negates a boolean value so !true evaluates to false, and !false evaluates to true.

Question 530

What are the two Boolean values?

Answer 530

True and False

Question 531

What is the strict equality operator?

Answer 531

===

Question 532

What does the strict equality do? What does it look for?

Answer 532

it looks to see if on both sides of the operator share the same data type and the same value

5 === 5 will return true because they are both numbers and they have the same value

5=== 3 + 2 will also be true

5 === five
will be false because, although they both mean 5 one is a number and the other is a string

Question 533

what is the normal equality operator?

Answer 533

==

Question 534

what does the normal equality operator do? what does it look for?

Answer 534

This looks just to see if the values are the same without taking into account the data types

1 == “hello”
this will be true, because neither one of these values are “falsy” boolean values, therefor Boolean returns them both as true and they are equal so the value will be returned as true

Question 535

how should we think about conditional keywords as far as what it means?

Answer 535

if — ( if this…..do that)
else if — ( then if this……do that too)
else — (if not….. then just do this instead)

Question 536

what is a common pattern using conditionals?

Answer 536

setting a value to null (purposely undefined) and then setting a conditional that will define it given a specific circumstance.

let myVar = null;
if (conditional "if this statement is true") {
  myVar = 'something other than default';
}

Question 537

What are the three keywords that we use in dealing with errors?

Answer 537

try, catch, finally

Question 538

what is the try block?

Answer 538

it allows us to specify a block of behavior that is to be tried (the try block) in the event of an error

Question 539

what is the catch block?

Answer 539

If the try block does not succeed, the behavior in the catch block runs.

Question 540

what is the finally block?

Answer 540

And in either the success or failure case of the catch block , the instructions in the finally block will run.

Question 541

can the catch and try block be used without the finally block?

Answer 541

yes it can

Question 542

what does an error object contain?

Answer 542

it contains information about an error that occurs

Question 543

what should you name your error parameters in the catch block?

Answer 543

name it e or err because these are conventions

Question 544

what is throw keyword do?

Answer 544

intentionally cause an error for bugging purposes

Question 545

what is a caught error?

Answer 545

a caught error is an error that has a catch block assigned to it, this type of error will have the catch block ran and will not stop code execution

Question 546

what is an uncaught error?

Answer 546

an error that doesn’t have a catch block assigned to it and this type of error will stop code execution dead in its tracks

Question 547

what is declaring a variable?

Answer 547

giving a variable a name

var name

Question 548

what is assigning a variable?

Answer 548

giving the variable name a value

var name = rashaan

Question 549

What’s the opening comment out tag for html?

Answer 549

! - -

Question 550

What is the closing tag for commenting out in html

Answer 550

• • >

Question 551

How to you create an internal link between websites?

Answer 551

1. Use # and create a name to work as the url of the href

a href = “#contact-us”> info < a

2. Use that same name as the id for that element

p id = “contact-us”

Question 552

What is a dead link? What is it’s purpose?

Answer 552

Sometimes you want to create a link even though you don’t know where it’s going just yet - in this case you create a dead link

Question 553

How do you create a dead link?

Answer 553

a href = “#”

Question 554

Can you make images a link?

Answer 554

Yes by nesting them inside of anchor tag

Question 555

what is font degradation ?

Answer 555

when you set up a font in CSS for a particular element but the browser doesnt recognize that font or support it it returns to a default font

Question 556

how can you set up a secondary font in case of font degradation ?

Answer 556

add a comma and a second font

p {
font-family: roman, lobster;
}

Question 557

can you add multiple classes to an element?

Answer 557

yes you can.

Question 558

how do you add multiple classes to an element?

Answer 558

put a space between the two classes and enclose them within one set of quotes

p = class ‘happy gilmore’

happy is a class and gilmore is a different class

Question 559

what happens when you set an elements margin to a negative number?

Answer 559

it grows larger

Question 560

what is clockwise notation?

Answer 560

instead of using specific sides to set the deminsions of elements like border or padding, just using one shorthand property and where the numbers represent a side in a clock wise fashion.

padding, top right bottom left

padding 20px 30px 40px 50px

Question 561

do you need commas in clockwise notation?

Answer 561

no you do not

Question 562

what is grey box wireframing?

Answer 562

Greybox wireframes are used to prototype basic functionality. We don’t consider logos, colors, or dynamic effects. Instead, greyboxing emphasizes defining content types and hierarchy.

Question 563

What does the error ‘cannot access variable name before initialization mean’? and how can you fix it?

Answer 563

Generally, it means that you are trying to define something while using itself inside of the definition. (
example

let item = array.map(function(x){
item + 2;}

this will cause this type of error. Because you are trying to set the name item to the value of the map method and the value of the function, but since item hasnt been set yet, when it gets to the part of the function and comes across item, it sends an error because item has no value, so it gets stuck like ‘what do i add two to’?

you would have adjust the function so that item is defined and given an value and in a seperate line of code, access it

Question 564

How do you add the text on an input type= ‘button’ ?

Answer 564

you add the attribute value =”text here”

Question 565

when you have a button tag inside of a form tag what will be the default type and function of the button?

Answer 565

it will have default submit functionality meaning it will automatically try to submit info to the server even if one isnt present