HTML Flashcards
What is HTML and what is it used for?
HTML is a textual language for creating webpages.
What is the format of an HTML file?
- Start with an indication of the document type
- then a head part with the page title and other page information
- Finally a body part with the actual page content
- May also contain CSS and JavaScript code
What is an HTML element?
A single HTML structure that is represented with HTML tags. Most HTML elements have an opening and closing tag.
How do you write HTML opening / closing tags for the ‘p’ element?
<p> paragraph </p>
What are common HTML elements?
- h1, h2, h3: Headers, largest to smallest
- p: paragraph
- em, strong: italics and bold
- img: image (no closing tag)
- a: Link
What are HTML tag attributes?
Special words used inside the opening tag to control the element’s behaviour.
How does an anchor element create a link on a webpage?
With the href attribute in the opening a tag. Ex: a href=”link” </a>
What is the syntax of a comment in HTML?
< ! - - Text - - >
(no whitespace normally)
What is a void element?
An element that only needs an opening tag
What tag is the first in every .html?
The “!DOCTYPE html” tag.
What is enclosed by the “html” element?
Everything but the “!DOCTYPE html” tag
What element contains other elements not typically displayed in the webpage?
The “head” element
What element describes the documents data?
The “meta” element.
What does the “title” element specify?
The Documents name, usually displayed in the browser’s titlebar,
What element contains other elements rendered in the browser?
The “body” element
Why is it smart to use an HTML validator?
To check for depreciated HTML that may be handled unpredictably by browsers.
What is the tag to create a newline?
“br”
How is whitespace handled in HTML?
Multiple whitespace and newline characters will all be treated as a single whitespace
What is an HTML container?
Any element in a web document body that has opening and closing tags.
What content is held in the head container?
Introductory content
What content is held in the footer container?
Descriptive information about the webpage like author, copyright, or date modified
What content is held in the address container?
The person’s or organization’s contact information
What content is held in the main container?
The document’s primary content
What content is held in the section container?
Distinct parts of a document, such as a chapter
What content is held in the article container?
Self-contained content that can be reused independently, such as a news article
What content is held in the nav container?
Content relating to website navigation
What content is held in the aside container?
Content not directly related to the main topic of a document
What content is held in the div container?
Generic element for creating block containers
What content is held in the span container?
Generic element for creating inline containers
What is a block element?
- Fills the width of the element’s parent container and can contain other block elements, inline elements, and text.
- typically displayed starting and ending on new lines
What is an inline element?
- fills the minimum space possible in the element’s parent container
- can only contain text or other inline elements
What is best practice when selecting containers?
Select containers that convey semantic meaning and use div and span only when no other elements are appropriate
What are the tags for unordered and ordered lists?
- ul: unordered list.
- ol: ordered list.
What are the attributes to specify list type in an ordered list?
type = :
- 1: Numbered list
- A: uppercase letters
- a: lowercase letters
- I: uppercase roman numerals
- i: lowercase roman numerals
How do you change the bullets in an unordered list?
With the CSS style=list-style-type: property
How do you nest a list in HTML?
You insert the list tag within the li tag of an item in the parent list.
What is the element to create a table?
Table
What are the common table elements to interact with the table?
- caption : immediately follows the table tag
- tr : creates a row of cells
- th : creates a cell containing a header
- td : creates a cell containing table data
What attributes allow a td cell to occupy more than 1 cell?
colspan and rowspan. Ex: colspan=”3”
What are the 3 image formats used by web browsers?
- JPEG (Joint Photographic Experts Group)
- PNG (Portable Network Graphics)
- GIF (Graphics Interchange Format)
Which image format uses “lossy compression” to compress images?
JPEG
Which image format cannot display “true color”?
GIF
What are the most common URL schemes in an href attribute?
- http: (send requests and responses over the Internet without encryption.)
- https: (send requests and responses over the Internet with encryption.)
- mailto: (send email)
- file: (refer to a document on the same computer as the web browser)
- ftp: (transfer data files)
What is the difference between an absolute URL and relative URL?
Relative URL specifies the relative path to the web resource with no scheme or hostname, while absolute is a complete URL
How do you navigate to the parent directory in a relative URL?
../
How do you create a fragment identifier?
With the “id” attribute.
What does adding a fragment identifier do?
Allows URLs to link directly to the id’s location in the document
How do you reference a fragment identifier?
With the #(hashtag) after the URL, and then the fragment name. Ex: https://wikidedia.com/lincoln#history
What is a graphical hyperlink?
Using an img element instead of text to link the href attribute.
What are the anchors “target” attribute options?
- _self (navigate in the current page)
- _blank (open in a new tab or window)
What is an entity in HTML?
A mechanism for writing special characters or symbols
How do you access an HTML entity?
- The entity name, if it exists. Ex: & copy;
- The Decimal number. Ex: & #169;
- The Hexadecimal number. Ex: \&x000A9;
What are the entity names for non-breaking hyphen, and non-breaking whitespace, and what do they do?
They create a hyphen or whitespace that will not allow wrap around of the word if at the end of a line.
- & #8209;
- & nbsp;
