HTML Flashcards
(84 cards)
1
Q
1.HTML=
A
hyper text markup language
2
Q
- give 2 examples of programming languages
A
- Java Srript 2. python
3
Q
- elements=
A
as being boxes of content on our web page
4
Q
- three examples of elements=
A
- three examples of elements=
5
Q
- four exmaples of elements=
A
- division elements (divs) 2. headers 3.paragraphs 4. spans
6
Q
- what three critical elements does CodePen allows us to leave out?
A
- HTML 2.head 3.body elements
7
Q
- to create HTML elements we need to use______?
A
tags
8
Q
- H1 is considered to be a______?
A
tags
9
Q
- The ___ _____ are built into the language and must be written exactly as expected in order for our HTML to render correctly.
A
tag names
10
Q
10.For example, ______ is not a valid tag name in HTML, but ______ is
A
paragraph———P
11
Q
- You can use ______ ________ to verify which tag names exist and what elements they are used for.
A
online documentation
12
Q
- If we wanted to tag the sentence above as an important header (the biggest text by default), we’d use the _____and _____ beginning and end tags
A
<h1> and </h1>
13
Q
- what does an opening paragraph tag look like? what does a closing paragraph tag look like
A
<p> and </p>
14
Q
- The p (“paragraph”) element used for?
A
This element is meant for holding text. By default, it will render text to the screen on a new line.
15
Q
This element is meant for holding text. By default, it will render text to the screen on a new line.
A
div element
16
Q
16.<div> is a block-level element, meaning it will take up its own, full line.</div>
A
<div></div>
17
Q
17.The ______ _______ is a generic text container. It does not create a new line like the p element does. This element is invisible by default but can be used for styling words or phrases within a larger body of text.
A
span element <span></span>
18
Q
- Unlike <div>, ________ operates inline and therefore doesn’t take up its own line</div>
A
<span></span>
19
Q
19.Avoid using ____ ____ to resize text. ______ use size to indicate their relative importance, but _____ is preferred for general-purpose resizing.
A
a. heading tags b.headings c. CSS
20
Q
- You should only use one _______ per page. Using more than one will not result in an error, but using only one is seen as a best practice.
A
<h1></h1>
21
Q
- to create a button, all we have to do is use the semantic ______ _____
A
semantic
22
Q
1.What are HTML elements?
A
Elements are what we use to tell the browser how we want the supplied data to be displayed.
23
Q
“2.What is a ‘tag’?
“
A
An element consists of an opening and closing tag. The data supplied between the tags will be displayed per the instructions of the element.
24
Q
“3.How does the browser use HTML to create what I see?
“
A
The browser reads and interprets the HTML file to understand how the developer intended the data to appear on the screen.
25
"4.What are the basic HTML elements?
| "
"The elements we learned about yesterday were 'html', 'head', 'body', 'p', 'span', 'div', and 'h1'- 'h6'
"
26
5.This is known as being 'semantically correct
It is important to note that your HTML elements should match the exact information you are attempting to display.
27
6.When we need to include information that we don't want to render on the page (like the link to an image) we use special flags inside of our tags called _______?
attributes
29
8.The 'a' ("anchor") element, allows us to create links to other web pages (or even to other areas within our own web page). You will always see the 'a' element used with the ___ attribute to tell the browser what address you want the link to point to.
heref
30
9.An ____ element will display an image on the screen. It will always have an _____ attribute which points to the address of the image to be displayed. NOTE: img tags can be self-closing, as in they do not need two tags. Simply put the / before the closing bracket in the first tag:
31
10.
- =
This element represents an "unordered list". This is the parent element and will contain list items.
32
11.
- =
There is also an ordered, or numbered, list
33
12.Generally speaking, ______would be used for a grocery list
34
13.and _______ for a recipe where direction need to be followed in a specific order
35
14.This stands for ______ and is the companion to
- and
- . These elements represent the items to appear in the list. Any other elements can appear in an li.
36
15. Nested elements are referred to as ______ and the top level elements as _______
children.....parents
37
What does HTML allow us to do?
It allows us to display data on the screen, and give the browser information about the data.
38
____ uses different 'elements' to relay different information to the browser.
HTML
39
What are 4 examples of HTML elements?
1. header (header)
2. paragraph (P)
3. Image (img)
4. Link (a)
40
What is the anatomy or make-up of an HTML element
Data
41
What does a standard HTML page look like?
...everything in here will appear on the screen
42
An _____is the name of the item or instruction we are giving the browser
Element
43
We put elements inside of what we know as ____?
Tags
44
What element is just a generic holder or text container?
45
What does
stand for?
divider
46
_____ is used for styling or grouping elements together that are related to each other
47
What is a great web site to go to for HTML and CSS?
www.csstricks.com
48
Attributes...attr
A little bit of extra data that we can supply to our element in order to give it some behavior
Sometimes we need to supply more data to the element
49
what does an attribute look like?
Data
50
the ____ actually goes in the opening tag?
attribute
51
an ____ ______ actually lets us create a link on the page
anchor tag
55
what is the attribute of an image tag?
57
how does an image tag look?
58
what is that attribute of the image tag ![]()
?
src.....![]()
59
- =
unordered list....a list with bullet points and no numbers
60
a list with numbers 1 and 2 etc
61
a
- is just like a _____ or a wrapper
div
62
when using the
- as a wrapper...what goes in the inside?
63
what does the layout look like when using
64
with htlm we indent with what is called a ____ ____ relationship?
parent, child
65
what 2 ways does the layout look like when we include our css in our html?
....css goes here
66
the _____ ______ which tells html what type of file it is
rel attribute
67
the ____ attribute which tells the html file sheet where our css file sheet lives
src
68
what is the anatomy or syntax of CSS styling rules? what does this look like?
.slector {
Property: value:
{
69
what are class and id's thought to be?
attributes
70
the ____ and __ attributes that we can give our elements that allow us to name our elements individually or by there class
class & id attributes
71
the ____ goes inside of the opening tag
class attribute
72
show an example of the class set up
....inside the quotations you can call it whatever name you choose.
73
what does a wild card selector look like when using html?
* {
wildcard selector
}
74
*=
the wildcard selector or the everything selector
75
give an example of 4 selectors:
1. * the wildcard everything selector
2. the...p....element selector
3. the .class or class selector
4. the #id or id selector
76
while using css...give an example on how we would make the whole back ground color red?
* {
background-color:red;
}
77
while using css give an example on how we would change the font size on all paragraphs tp 36 pixels?
p{
font-size: 36px;
}
78
say we had an item in html that was called the following...
....while using css how would we change the back ground color to dodger blue?
.divClass {
background-color: dodgerblue;
{
79
lets say we had the following in html....< p class="pclass">a paragraph her .....how would we change the text color to red?
.pClass {
color: red;
}
80
lets say we had some html like the following....
a paragraph here
how would we change the font size to 28 pixels?
```
#paragraphID (
font-size: 28 px;
}
```
81
lets say in html we had the following:
....ans while using css we wanted to change the back ground color to dodger blue....how would we do this?
.box {
background-color: dodgerblue;
{
82
lets say in html we had the following:
...how would we change the width to 200 pixels and the height to 100 pixels?
.box (
width: 200px;
height: 100px;
{
83
what is the invisible margin called just outside the content in html?
padding
84
lets say in html we had the following:
....how would we change the padding to 40 pixels and the border to 5 pixels of solid red?
.box {
padding: 40px;
border: 5px sold red:
}
