TeamTreeHouse HTML Flashcards
What is another way of thinking about HTML?
HTML is just a set of tags in which content is wrapped
Where do you place .CSS files?
Usually in the same folder as your index.html but in a different file.
What are h tags all about?
h tags represent headlines, from largest to smallest and from < h1 > through < h6 >
Does html without a .css file have any style?
html has default styles w/out css
What is the first line in a html document?
< ! doctype html >
What is the first major tag after the < ! doctype html >
< head >
Which tag is shown in the browser tab?
< title >
Code for a stylesheet …
< link rel = “ stylesheet “ href = “ styles.css “ >
How do you code for lists
< ol >, < ul >
How do you code html for easier readability?
indent
What is another way of thinking of html?
think of html as a series of boxes that live within each other
Which tag “shows” the content?
< body >
Code for an image …
< img src = “https://www. … “ alt = “ some text “ >
Where can you find some random image to input into your webpage while working on it?
www.placeimg.com
What other use does listing a value in the < title > tag have?
screen readers use it for accesibility
Which tag is used to wrap the general content in a webpage?
< main >
What are the three main divisions of a page?
< header >, < main >, < footer >
What info is listed in the main < header > ?
Introductory info, name of site, company logo, main navigation which is a list of links to other pages on the site.
Which tag shows the bulk of content?
< main >
What info is listed in the < footer > ?
Copyright info, social media links, secondary navigation
What can be said about the image tag ?
It is self-closing.
Which tag is used for new paragraphs in html?
< p >
Code for a link to go to the top of the page …
< a href = “ # top “ > TOP < / a >
Code for a clickable image …
< p > < a href = “ # top “ > < img src = “ image.png “ > ME < / a > < / p >
Can an html element have more than one style ?
YES !
Code a new paragraph element for more than one class …
< p class = “ tag location “ > blah, blah < / p >
How do you code a class in CSS ?
With a dot …
.location {
background - color : # 222;
}
Code for a social media link in your footer …
< footer >
< ul >
< li > < a href = “ http://twitter.com “ > TWITTER < / a > < / li >
Code for a link to open in another browser window …
< a href = “ http://twitter.com “ target = “ _ blank “>TWITTER< / a >
What is each block of CSS called?
a rule
What does each CSS rule start out with?
a selector
Where can you find amazing CSS info?
www.css-tricks.com
How can you go about styling just one html element, for example just one paragraph?
You can use a CSS class or id selector.
Code for a < h2 > element with two CSS classes …
< h2 class = “ card title “ > BLAH < / h2 >
Can you use the same class on different html tags?
YES, YES a thousand times YES!
What is padding in CSS?
Padding is the space between content and it’s border.
What is margin in CSS?
Margin is the space between dispirate elements.
What is a one particular way of describing a website?
It is a collection of webpages.
How would you list a css file named resume.css from a folder named css?
< link rel = “ stylesheet “ href = “ css/resume.css “ >
Code to link to a different webpage named resume.html …
< li > < a href = “ resume.html “ > Experience < / a > < / li >
Code for a link to a different webpage named resume.html …
< li > learn more < a href = “ resume.html “ > view resume < / a > < / li >
Name the three seperate layers that make up a typical webpage?
Content (html), Presentation (CSS), Behavior (JS)
What is the most common name for the homepage of a website?
index.html
There should be only one of which tags on a webpage?
< html >, < head >, < body >, < h1 >
#
Which tags are used for lists in html?
< ol >, < ul >
Code for a nested list …
< ul >
< li > HOME < / li >
< li >
< ul > CONTACT
< li > PHONE < / li >
< / ul >
< / li >
< / ul >
What is the name for the a tag?
anchor tags
What is href stand for and what does it do?
href stands for hypertext reference and it changes the address in the URL bar.
Code for an anchor tag with a href …
< a href = “ https://teamtreehouse.com “ > TeamTreeHouse < / a >
HTML links can …
- Link a page on your site to another page on another site.
- Link a page on your site to another page on the same site.
- Link to a different location on the same page.
- Open a new page in a new browser window/tab.
- Begin composing an email in the user’s default email program.
What is an absolute URL?
It is all the info to navigate to a site, i.e. https://www. ….
Code for a new window/tab to open …
< a href = “ https://www.teamtreehouse.com “ target = “ _ blank “ > HELLO < / a >
Code to get to the top of a page …
< a href = “ # top “ > TOP < / a >
What is meant by semantic html?
It means that markup describes the meaning of content and don’t make everything just < div > ‘s
What are the three main divisions of a typical webpage?
< header >, < main >, < footer >
What is found in a typical header?
Introductory content, site logo, navigation and main heading