Brainscape's Knowledge GenomeTM


Top Flashcards (Certified)
All Flashcards

World Wide Pond Devlpmnt/Design > IES: HTML > Flashcards

IES: HTML Flashcards

(289 cards)

Start Studying
1
Q

<p>
</p>

A
  • Block element
  • Paragraph container separates content into sentences and paragraphs to be more easily read and more readily understood
  • The browser usually separates each paragraph element typically leaving two empty lines between them.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

<article>
</article>

A
  • Article container element
  • contains a stand-alone composition
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

<a></a>

A
  • The anchor is an Inline element that defines a hyperlink which allows users to navigate from one page to another.
  • The href attribute is most important to this element indicating the link’s destination: Without href, there is no hyperlink.
  • The anchor can also include a title attribute displaying a “tooltip” when the hyperlink is hovered over.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

URL

A
  • A web address is formally known as a uniform resource locator
  • Has three parts: protocol, domain, and its path
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

HTML

A
  • hypertext markup language
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

HTTP

A
  • Hypertext transfer protocol
  • This is the first of the three parts that make up the URL: the protocol
  • Always appears as the URL prefix: http://
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

HTTPS

A
  • Hypertext transfer protocol secure
  • Always appears as the URL prefix : https://
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Protocol

A
  • A set of rules governing the exchange or transmission of data between devices
  • Denoted by the prefix on any URL
  • (example http://… or https://…)
  • 1st of 3 parts of the URL
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

IP

A
  • Internet Protocol
  • The numerical address of a specific domain name
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

WHATWG

A
  • Web hypertext application technology working group
  • An organization or group that sustains or supports the standard of the HTML language established by the W3C to prevent that Global Internet language from being fragmented or compromised
  • This agency maintains the ever-evolving HTML living standard as technology in the world wide web culture demands
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

W3C

A
  • Short for World Wide Web Consortium
  • It is the international governing body for the development of platform-independent web standards and specifications
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Domain Or domain name

A
  • The hostname of the computer from which the file can be downloaded. For instance: www.example.com
  • The second of three parts of a URL
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Path

A
  • The file name prefixed by any Parent Directory names where applicable. For instance:/htdocs/index HTML
  • The third of three parts that form a URL
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

DNS

A
  • The domain name system (DNS) Is the phone book of the internet. Humans access information online through domain names, like nytimes.com or espn.com
  • DNS servers translate domain names into IP addresses, so browsers can load Internet resources.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Webserver

A
  • The World Wide Web is comprised of a series of large-capacity computers known as web servers.
  • Upon request from a computer for a resource, a web server will send back response headers and a copy of the requested file or an error message.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

HTML document skeletal structure

A

The skeletal structure has three parts:
* document type declaration
* Head section
* Body section

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

Document type declaration

A
  • <!doctype html>
  • Declaring precisely which version of HTML is used to mark up the document.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

<head>
</head>

A
  • provides descriptive data about the document itself, such as the document title and the character set used.
  • Non-empty element
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

<body>
</body>

A
  • Contains the content that is to appear when the document gets loaded into a web browser
  • Non-empty element
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

HTML fundamental structure (basic coding structure)

A

<!doctype html>

<html>
<head>
<!--Data describing the document to be added here. →
</head>

<body>
<!--Content to appear in the browser to be added here.–>
</body>
</html>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

lang

A
  • attribute of the HTML root element
  • <html lang=”en”> (the previous “lang” attribute code appoints the document’s language as English) (“ar”: Arabic, “fr”: French, “es”: Spanish)
  • attribute of the HTML root element
  • <html lang=”en”> (the previous “lang” attribute code appoints the document’s language as English) (“ar”: Arabic, “fr”: French, “es”: Spanish)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

<meta></meta>

A
  • empty element
  • presents Information or parameters about the document itself
  • always appears in the head of the document’s HTML coding
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

Charset

A
  • Character-set
  • Charset is an attribute of the meta element
  • Example coding: ( <meta charset=”utf-8”> )
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

UTF-8

A
  • Setting the Charset as utf-8 assigns an 8-bit Unicode Transformation Format For the HTML document
  • A type of character encoding format
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
</div> </div> <div class='card-face answer'> <div class='answer-content'> * Text container in the head where the doc’s title is placed * very important for SEO. Used extensively: * bookmarks * Title bar * Navigation tab * History * Search engines * Title should be short and meaningful: ideal length- 10 characters or less. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='26' id='card-480078575'> <div class='header'> 26 </div> <div class='card-face question'> <div class='question-content'> SEO </div> </div> <div class='card-face answer'> <div class='answer-content'> * Search Engine Optimization. * Highly prized process of improving a page's organic page rankings (rank in search results) presumably, maximizing the number of visitors to a particular website. * It is useful to provide sufficient metadata that describes the page content well. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='27' id='card-480078576'> <div class='header'> 27 </div> <div class='card-face question'> <div class='question-content'> <h1> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Block element * The tags For this element contain the largest of 6 different sizes of headings and subheadings * Usually holds the doc’s main heading (Should be only one in doc, but can be more) </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='28' id='card-480078578'> <div class='header'> 28 </div> <div class='card-face question'> <div class='question-content'> W3C Validator Tool </div> </div> <div class='card-face answer'> <div class='answer-content'> * Validator.w3.org * Validator tools verify that any HTML doc will conform to its specified document type declaration: thereby, always appearing correctly in any standards-compliant browser. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='29' id='card-480078580'> <div class='header'> 29 </div> <div class='card-face question'> <div class='question-content'> HTML “character entities” </div> </div> <div class='card-face answer'> <div class='answer-content'> * In HTML coding, the way of including special characters in the document * Begins with an ampersand and ends with a semicolon (& … ;) (W3C Chart of all character entities at: dev.w3.org/html5/html-author/charref) * Best avoided in doc titles as the vocal narrator used by visually impaired viewers may read entity as a word. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='30' id='card-480078586'> <div class='header'> 30 </div> <div class='card-face question'> <div class='question-content'> <!--"<"--> | (The only coding relevant to this question lies between the quotes.) </div> </div> <div class='card-face answer'> <div class='answer-content'> * (<) * These are often needed to avoid confusion with the angled brackets that surround each HTML tag. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='31' id='card-480079452'> <div class='header'> 31 </div> <div class='card-face question'> <div class='question-content'> <!--">"--> | (The only coding relevant to this question lies between the quotes.) </div> </div> <div class='card-face answer'> <div class='answer-content'> * (>) * These are often needed to avoid confusion with the angled brackets that surround each HTML tag. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='32' id='card-480079455'> <div class='header'> 32 </div> <div class='card-face question'> <div class='question-content'> Word of coding: * begins with " &..." * followed by "..nbsp.." * ending in "..; " | (The only coding relevant to this question lies between the quotes.) </div> </div> <div class='card-face answer'> <div class='answer-content'> * (a single non-breaking space) * A commonly used HTML entity * A space that will not break into a new line. * Two words separated by a non-breaking space will stick together (not break into a new line). * This is handy when breaking the words might be disruptive. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='33' id='card-480079457'> <div class='header'> 33 </div> <div class='card-face question'> <div class='question-content'> <!--"•"--> | (The only coding relevant to this question lies between the quotes.) </div> </div> <div class='card-face answer'> <div class='answer-content'> * (bullet point) </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='34' id='card-480079462'> <div class='header'> 34 </div> <div class='card-face question'> <div class='question-content'> <!--"©"--> | (The only coding relevant to this question lies between the quotes.) </div> </div> <div class='card-face answer'> <div class='answer-content'> * (©) </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='35' id='card-480079464'> <div class='header'> 35 </div> <div class='card-face question'> <div class='question-content'> <!--"™"--> | (The only coding relevant to this question lies between the quotes.) </div> </div> <div class='card-face answer'> <div class='answer-content'> * (™) </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='36' id='card-480079465'> <div class='header'> 36 </div> <div class='card-face question'> <div class='question-content'> <!--"®"--> | (The only coding relevant to this question lies between the quotes.) </div> </div> <div class='card-face answer'> <div class='answer-content'> * (®) </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='37' id='card-480079476'> <div class='header'> 37 </div> <div class='card-face question'> <div class='question-content'> <!--"""--> | (The only coding relevant to this question lies between the quotes.) </div> </div> <div class='card-face answer'> <div class='answer-content'> * ( “ ), (Quotation marks) * Example: "HTML in easy steps" (Appears as "HTML in easy steps") </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='38' id='card-480079484'> <div class='header'> 38 </div> <div class='card-face question'> <div class='question-content'> To launch the narrator in Windows 10 </div> </div> <div class='card-face answer'> <div class='answer-content'> * WinKey + Ctrl + Enter * Press the “tab” button to hear the document title </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='39' id='card-480079492'> <div class='header'> 39 </div> <div class='card-face question'> <div class='question-content'> Coding in HTML to place a comment that is ignored by the browser </div> </div> <div class='card-face answer'> <div class='answer-content'> * <!--notes or comments here--> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='40' id='card-480079496'> <div class='header'> 40 </div> <div class='card-face question'> <div class='question-content'> Optimize doc view (all screens) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Optimizes the page view for smaller / larger screens: ensures doc will fill the device screen width * Sets the initial zoom level so the content is not zoomed. * Coding: <meta name=”viewport” content=”width=device-width, initial-scale=1”> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='41' id='card-480080611'> <div class='header'> 41 </div> <div class='card-face question'> <div class='question-content'> Auto-page reload </div> </div> <div class='card-face answer'> <div class='answer-content'> * A technique often used in websites to dynamically update news our status items * Does not depend on JavaScript support * Coding: <meta http-equiv=”refresh” content=”5”> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='42' id='card-480080614'> <div class='header'> 42 </div> <div class='card-face question'> <div class='question-content'> Auto page redirection </div> </div> <div class='card-face answer'> <div class='answer-content'> * Coding: <meta http-equiv=”refresh” content=”5; url=’new-page.html’”> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='43' id='card-480080618'> <div class='header'> 43 </div> <div class='card-face question'> <div class='question-content'> SERP </div> </div> <div class='card-face answer'> <div class='answer-content'> * search engine result page * Will Show The Meta description in search results below the page title </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='44' id='card-480080624'> <div class='header'> 44 </div> <div class='card-face question'> <div class='question-content'> Meta “description” </div> </div> <div class='card-face answer'> <div class='answer-content'> * Should be between 50 and 160 characters long * Including keywords relative to the text content is important for SEO purposes * Coding: <meta name=”description” content=”place the page description here including the relevant keywords of the document within”> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='45' id='card-480080625'> <div class='header'> 45 </div> <div class='card-face question'> <div class='question-content'> Canonical link </div> </div> <div class='card-face answer'> <div class='answer-content'> * If a website contains pages of identical or very similar content you can specify which page is to be indexed by including this. * - designates the original source for a piece of content * Coding: <link rel=”canonical” href=”http://www.examplepage.com”/> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='46' id='card-480080635'> <div class='header'> 46 </div> <div class='card-face question'> <div class='question-content'> <link> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Empty element * Used to incorporate resources in a document * ONLY appears in the head of the document (may contain many links) * Must contain “rel” and “href” attributes * May contain title or type attributes </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='47' id='card-480080641'> <div class='header'> 47 </div> <div class='card-face question'> <div class='question-content'> type </div> </div> <div class='card-face answer'> <div class='answer-content'> * Hints at the MIME type of the link resource. * For <button> elements, attribute specifies the type of button. * For <input> elements, attribute specifies the type of <input> element to display. * For <embed>, <link>, <object>, <script>, <source>, and <style> elements attribute specifies the Internet media type (formerly known as MIME type). * May intend to help search engines to locate resources associated with the HTML document. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='48' id='card-480080642'> <div class='header'> 48 </div> <div class='card-face question'> <div class='question-content'> title </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies extra information about an element or resource. * The information is most often shown as a tooltip text when the mouse moves over the element. * The title attribute is part of the Global Attributes, and can be used on any HTML element. * May include a title for the page in another language </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='49' id='card-480080645'> <div class='header'> 49 </div> <div class='card-face question'> <div class='question-content'> CSS </div> </div> <div class='card-face answer'> <div class='answer-content'> * Cascading Style Sheets contain hierarchical information about how the content of a web page will be rendered in a browser or the presentational aspects of the content. When multiple rules select the same property, the order of precedence: * 1st) Generally, the rule read last by browser; * 2nd) In-line rules (style as attribute); * 3rd) embedded rules (<style> tags in head); * 4th) external rules (<link> tag (in head) to stylesheet); </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='50' id='card-480080646'> <div class='header'> 50 </div> <div class='card-face question'> <div class='question-content'> rel </div> </div> <div class='card-face answer'> <div class='answer-content'> * Attribute : “relationship” * Example : <link rel=”stylesheet” href=”Daigle-style.css”> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='51' id='card-480080648'> <div class='header'> 51 </div> <div class='card-face question'> <div class='question-content'> href </div> </div> <div class='card-face answer'> <div class='answer-content'> * The Hypertext reference is an attribute of the anchor tag, which is * used to identify sections within a document (i.e. internal links) * used to identify links to pages in other sites (i.e. external links) * The HREF contains two components: the URL, which is the actual link, and the clickable text that appears on the page, called the "anchor text." * Example: <a href=”#a”>A</a> * * (in-document hypertext navigational link anchor) * Example: <a href="laurendaigle.com”>Lauren Daigle's Site</a> * * (external hypertext link anchor) </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='52' id='card-480080649'> <div class='header'> 52 </div> <div class='card-face question'> <div class='question-content'> <style> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Added within or linked to an HTML document To present the rules governing how the content will appear Rules governing the content appearance are linked to the html doc through: * Can be embedded within the head section * Employed as an attribute in-line * Linked by use of an external document to single or multiple HTML documents </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='53' id='card-480100544'> <div class='header'> 53 </div> <div class='card-face question'> <div class='question-content'> <div> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Block element; semantically meaningless; anonymous. (**Best avoided in favor of more meaningful tags**) * Not to be used for structural purposes: should be used for stylistic purposes. * Can include an id, class, or style attribute for application of style rules. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='54' id='card-480100546'> <div class='header'> 54 </div> <div class='card-face question'> <div class='question-content'> <span> </div> </div> <div class='card-face answer'> <div class='answer-content'> * In-line element; semantically meaningless; anonymous (**Best avoided in favor of more meaningful tags**) * Not to be used for structural purposes: it should rather be used for stylistic purposes. * Can include an id, class, or style attribute for application of style rules. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='55' id='card-480100550'> <div class='header'> 55 </div> <div class='card-face question'> <div class='question-content'> <script> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Best placed right before the body closing tag (</body>), so browser Can process doc content before reading script * Embeds JavaScript within an HTML document; links doc to a separate file: <script src=”script.js”> … </script>; or JS can be specified by script in-line to on-event (Ex: a mouse click event - <h1 onclick=”alert(‘Clicked!’)”> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='56' id='card-480100551'> <div class='header'> 56 </div> <div class='card-face question'> <div class='question-content'> <noscript> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Only displayed when JavaScript functionality is absent or disabled * Text container for Alternative fallback content (Example- <noscript>JavaScript Is Not Enabled!</noscript> ) </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='57' id='card-480100552'> <div class='header'> 57 </div> <div class='card-face question'> <div class='question-content'> <slot> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Exists purely for scripting </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='58' id='card-480100553'> <div class='header'> 58 </div> <div class='card-face question'> <div class='question-content'> <template> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Exists purely for scripting </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='59' id='card-480100564'> <div class='header'> 59 </div> <div class='card-face question'> <div class='question-content'> MIME </div> </div> <div class='card-face answer'> <div class='answer-content'> * Multipart Internet Mail Extension * Standard for formatting files of different types, such as text, graphics, or audio, so they can be sent over the internet and seen or played by a web browser or email application. * Describes file types: ex.: “text/html” * Official list at: http://www.iana.org/assignments/media-types/media-types.xhtml </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='60' id='card-480100567'> <div class='header'> 60 </div> <div class='card-face question'> <div class='question-content'> <base> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Empty element * Specifies an alternate directory holding resources/files to be recognized by the browser. ( <base href=”http://localhost/resources/”> ) * Must be placed in doc head before any <link> elements. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='61' id='card-480100675'> <div class='header'> 61 </div> <div class='card-face question'> <div class='question-content'> Absolute address </div> </div> <div class='card-face answer'> <div class='answer-content'> * Includes the entire URL: protocol, domain name, and path * Example: “https://www.laurendaigle.com/Daigle-turquoise.jpg” </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='62' id='card-480100676'> <div class='header'> 62 </div> <div class='card-face question'> <div class='question-content'> Relative address </div> </div> <div class='card-face answer'> <div class='answer-content'> * Can reference a file in home directory of the main HTML document by file name and may use the ../ syntax to reference that parent directory. (Example: /Daigle-turquoise.jpg) * By default, the browser will look in HTML doc’s home directory. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='63' id='card-480100678'> <div class='header'> 63 </div> <div class='card-face question'> <div class='question-content'> Permitted “rel” values </div> </div> <div class='card-face answer'> <div class='answer-content'> * (Many are intended to help search engines locate resources associated with that HTML document (a.k.a. Increase traffic to your webpage/website/document)) * Alternate * Author * Bookmark * Help * Icon * License * Next * Nofollow * Noreferrer * Prev * Search * Stylesheet * Tag * Shortcut icon </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='64' id='card-480100679'> <div class='header'> 64 </div> <div class='card-face question'> <div class='question-content'> Icon </div> </div> <div class='card-face answer'> <div class='answer-content'> * Established in the head * Force browser to refresh icon- assign “favicon.ico?v=2” to link’s href attribute * Coding: <link rel=”shortcut icon” href=”favicon.ico”> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='65' id='card-480100680'> <div class='header'> 65 </div> <div class='card-face question'> <div class='question-content'> Heading elements </div> </div> <div class='card-face answer'> <div class='answer-content'> * Order of importance (<h1>, <h2>, <h3>, <h4>, <h5>, <h6>) should implicitly convey the document structure through correct sequencing of the heading tags * Correct sequencing and use of meta keywords in headings is important to SEO and allows syndication into another site **Never use heading tags for their style qualities </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='66' id='card-480100681'> <div class='header'> 66 </div> <div class='card-face question'> <div class='question-content'> <hgroup> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Grouping solution to the limited number of heading levels and the need to maintain a correctly sequenced document outline * Doc may contain multiple hgroup elements, but an hgroup may contain ONLY heading elements. * Ex. code <hgroup> <h1>HTML</h1> <h2>Building better websites</h2> </hgroup> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='67' id='card-480100682'> <div class='header'> 67 </div> <div class='card-face question'> <div class='question-content'> <header> </div> </div> <div class='card-face answer'> <div class='answer-content'> * May contain heading; hgroup; intro items like icons, banners, and table of contents; etc * *You cannot Nest header elements one within another * Ex. code <header> <img src=”Daigle-turquoise-banner.jpg” width=”500” height=”72” alt=”Banner”> <hgroup> <h1>HTML</h1> <h2>Building better websites</h2> </hgroup> </header> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='68' id='card-480100687'> <div class='header'> 68 </div> <div class='card-face question'> <div class='question-content'> <nav> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Acts as a wrapper (not to replace any structural element) enclosing page-wide or site-wide navigation hyperlinks groups * Includes ONLY page-wide or site-wide nav hyperlinks groups * Ex. code <nav id=”horizontal”> <h2>Site Links</h2> <p> <a href=”#html”>Markup</a> | <a href=”#js”>Scripting</a> | <a href=”#css”>Style Sheets</a> </p> </nav> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='69' id='card-480100688'> <div class='header'> 69 </div> <div class='card-face question'> <div class='question-content'> <img> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Empty element * used to embed an image in an HTML page * are not technically inserted into a web page: they are linked to web pages * creates a holding space for the referenced image * Ex. code <img src=”Daigle-turquoise-banner.jpg” width=”500” height=”72” alt=”Banner”> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='70' id='card-480100689'> <div class='header'> 70 </div> <div class='card-face question'> <div class='question-content'> <menu> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Includes a list of commands for the webpage or website * Groups of hyperlinks on a webpage navigating around the page or website should be enclosed in nav tags or menu tags </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='71' id='card-480104890'> <div class='header'> 71 </div> <div class='card-face question'> <div class='question-content'> <br> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Line break element Can force the text to wrap to The next line Before It would automatically wrap to the next line at the text container elements edge </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='72' id='card-480104891'> <div class='header'> 72 </div> <div class='card-face question'> <div class='question-content'> <footer> </div> </div> <div class='card-face answer'> <div class='answer-content'> * A footer can be included in a doc or article, section, etc. of a doc and provides info about the doc or division of the.doc * Might contain an address element (contact details, etc.); a small element (copyright, etc.); and a nav element * Ex. code <footer> <nav> … </nav> <small>Copyright © Example Corp.</small> <address>www.example.com</address> </footer> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='73' id='card-480104892'> <div class='header'> 73 </div> <div class='card-face question'> <div class='question-content'> <main> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Page content container located between the header and the footer * Ex. code <body> <header> </header> <main> <p>(Page content goes here.)</p> </main> <footer> </footer> </body> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='74' id='card-480104893'> <div class='header'> 74 </div> <div class='card-face question'> <div class='question-content'> <small> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Formats text (fine print items) within the body of the document, but is only meant to contain short comments that supplement surrounding content * Regarded as a side comment to surrounding text such as copyright information * *Does not denote content of lesser importance </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='75' id='card-480104894'> <div class='header'> 75 </div> <div class='card-face question'> <div class='question-content'> <address> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Container for Author’s name, author’s contact info, etc. * Often located in the footer element </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='76' id='card-480104901'> <div class='header'> 76 </div> <div class='card-face question'> <div class='question-content'> <article> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Contains a stand-alone composition * Might typically begin with its own heading followed by one or more paragraphs </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='77' id='card-480104902'> <div class='header'> 77 </div> <div class='card-face question'> <div class='question-content'> VPN </div> </div> <div class='card-face answer'> <div class='answer-content'> * A virtual private network gives online privacy & anonymity by creating a private network from a public internet connection. * extends a private network across a public network * enables users to send and receive data across shared or public networks as if their computing devices were directly connected to the private network. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='78' id='card-480104903'> <div class='header'> 78 </div> <div class='card-face question'> <div class='question-content'> <aside> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Typically a sidebar or footnote, it should contain stand alone info (*May contain a footer element, but not a nav hyperlink). * Can be nested in an article element incorporating contents SOMEWHAT RELATED to the main content, or used alone containing secondary content RELATED to the entire page, such as advertising. * Ex code <article> <p>Oscar Wilde</p> <aside>(1854-1900)<br> Was an Irish writer and poet. </aside> </article> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='79' id='card-480104904'> <div class='header'> 79 </div> <div class='card-face question'> <div class='question-content'> <section> </div> </div> <div class='card-face answer'> <div class='answer-content'> * A grouping Element * Not required in short docs unless you want to add section headings and footers * Content placed within a body element and nested within a main element can also then be nested in a section element </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='80' id='card-480104905'> <div class='header'> 80 </div> <div class='card-face question'> <div class='question-content'> <hr> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Empty element * A horizontal rule tag can be inserted between paragraphs drawing a line separating them, but it may not be inserted inside of paragraph to separate sentences * It represents a “paragraph-level thematic break“ such as a scene change in a story * It represents the equivalent of an ellipsis standing alone on its own line </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='81' id='card-480104906'> <div class='header'> 81 </div> <div class='card-face question'> <div class='question-content'> Flow </div> </div> <div class='card-face answer'> <div class='answer-content'> * the arrangement of page elements as defined by positioning statements and the order of html statements * how the different elements take up space and arrange themselves around each other. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='82' id='card-480104908'> <div class='header'> 82 </div> <div class='card-face question'> <div class='question-content'> Phrasing </div> </div> <div class='card-face answer'> <div class='answer-content'> * The use of HTML phrase tags are special purpose tags, which define the structural meaning of a block of text or semantics of text. * Must always be enclosed by a flow element * Ex. <q> , <em> </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='83' id='card-480104909'> <div class='header'> 83 </div> <div class='card-face question'> <div class='question-content'> <b> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Changes font to bold * should <b>only be used as a last resort: One legitimate use is to mark up the lead sentence of an article * No emphasis added or changed </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='84' id='card-480104910'> <div class='header'> 84 </div> <div class='card-face question'> <div class='question-content'> <q> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The quotes element causes the browser to automatically add quotation marks around the content * phrasing element * Quote elements can be nested one within another </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='85' id='card-480104911'> <div class='header'> 85 </div> <div class='card-face question'> <div class='question-content'> <em> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The emphasis element creates italics in the font and bears an emphasized semantic meaning in the content * Used as an inline element for stylistic and semantic purposes with the font and content </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='86' id='card-480104912'> <div class='header'> 86 </div> <div class='card-face question'> <div class='question-content'> <blockquote> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Intended to surround long quotations from another source and bears no quotation marks * Typically produces a rectangular block area to contain the quotation starting on a new line and indented from surrounding content </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='87' id='card-480104913'> <div class='header'> 87 </div> <div class='card-face question'> <div class='question-content'> <strong> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Changes Font to bold * Emphasizes or increases Without changing the meaning of the sentence </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='88' id='card-480104914'> <div class='header'> 88 </div> <div class='card-face question'> <div class='question-content'> <i> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Changes font to italics (should only be used as a last resort) * Text is enhanced without conveying extra importance such as technical terms </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='89' id='card-480104918'> <div class='header'> 89 </div> <div class='card-face question'> <div class='question-content'> <s> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The strikethrough is a phrasing element marking the text as being superseded by more accurate, relevant, up-to-date content * Typically displayed with a strikethrough line **Should not be used to indicate edited content </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='90' id='card-480104919'> <div class='header'> 90 </div> <div class='card-face question'> <div class='question-content'> <del> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The deleted-text element formats text with a strikethrough, and may include a cite attribute to specify a doc’s URL that will explain the changes * Text within is regarded as having been removed from the document such as a completed item in a to-do list </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='91' id='card-480104920'> <div class='header'> 91 </div> <div class='card-face question'> <div class='question-content'> <ins> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The inserted-text element formats text with an underline: may include a cite attribute to specify a docs URL explaining changes. * Text within is regarded as having been added to the document such as a new additional items in a to-do list </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='92' id='card-480104921'> <div class='header'> 92 </div> <div class='card-face question'> <div class='question-content'> <wbr> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The word-break-opportunity is a phrasing element INVISIBLY marking the text broken by this tag as being a suitable point at which to break the line of text * Particularly suitable for small devices for docs that may contain content that may exceed the width of browser </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='93' id='card-480104922'> <div class='header'> 93 </div> <div class='card-face question'> <div class='question-content'> <u> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The unarticulated annotation (underline) is a phrasing element marking the text as being different in some way to normal text content and is TYPICALLY underlined. * Has the purpose of labeling misspelled words or labeling proper names in Chinese. **Use is strongly discouraged due to confusion with hyperlinks. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='94' id='card-480104923'> <div class='header'> 94 </div> <div class='card-face question'> <div class='question-content'> <pre> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Flow/Block element that preserves the preformatting of the enclosed text: 1.) preserves white space; 2) renders all text with a fixed-width font; 3) disables automatic word-wrapping; 4) does not disable bi-directional processing * *Use spaces in the place of tabs when preparing pre-formatted text </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='95' id='card-480104924'> <div class='header'> 95 </div> <div class='card-face question'> <div class='question-content'> <mark> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The marked-text is a phrasing element indicating the text as being of special significance for reference or notation. * Typically displayed in a colored background block to highlight the text * Not for emphasis: only to be used to highlight the relevance or importance of the text within a doc </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='96' id='card-480104935'> <div class='header'> 96 </div> <div class='card-face question'> <div class='question-content'> <sub> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The subscript element specifies inline text typically with a lowered baseline using smaller font displayed for solely typographical reasons. * Numbers (0-9) = ₀ - ₉ * *Any content can be included within the tags, whereas, the availability of character entity references is limited. </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='97' id='card-480549385'> <div class='header'> 97 </div> <div class='card-face question'> <div class='question-content'> <!--₀--> | html coding : ₀ </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "0" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='98' id='card-480549398'> <div class='header'> 98 </div> <div class='card-face question'> <div class='question-content'> <!--₁--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "1" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='99' id='card-480549405'> <div class='header'> 99 </div> <div class='card-face question'> <div class='question-content'> <!--₂--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "2" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='100' id='card-480549419'> <div class='header'> 100 </div> <div class='card-face question'> <div class='question-content'> <!--₃--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "3" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='101' id='card-480549440'> <div class='header'> 101 </div> <div class='card-face question'> <div class='question-content'> <!--₄--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "4" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='102' id='card-480549449'> <div class='header'> 102 </div> <div class='card-face question'> <div class='question-content'> <!--₅--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "5" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='103' id='card-480549464'> <div class='header'> 103 </div> <div class='card-face question'> <div class='question-content'> <!--₆--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "6" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='104' id='card-480549475'> <div class='header'> 104 </div> <div class='card-face question'> <div class='question-content'> <!--₇--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "7" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='105' id='card-480549484'> <div class='header'> 105 </div> <div class='card-face question'> <div class='question-content'> <!--₈--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "8" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='106' id='card-480549492'> <div class='header'> 106 </div> <div class='card-face question'> <div class='question-content'> <!--₉--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * subscript "9" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='107' id='card-480104936'> <div class='header'> 107 </div> <div class='card-face question'> <div class='question-content'> <sup> ; ⊃ </div> </div> <div class='card-face answer'> <div class='answer-content'> * The superscript (element and entity) specifies inline text typically with a raised baseline using smaller font and displayed for solely typographical reasons. * Numbers = 1= ¹ 2= ² 3= ³ 4=⁴ 5= ⁵ 6= ⁶ 7= ⁷ 8= ⁸ 9= ⁹ 0= ⁰ * *Any content can be included within the tags, whereas, the availability of character entity references is limited. * * <sup>2</sup> appears larger than “ ²” ; however, the entity as opposed to the tag keeps line spacings equal </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='108' id='card-480550287'> <div class='header'> 108 </div> <div class='card-face question'> <div class='question-content'> <!--¹--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "1" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='109' id='card-480550297'> <div class='header'> 109 </div> <div class='card-face question'> <div class='question-content'> <!--²--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "2" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='110' id='card-480550307'> <div class='header'> 110 </div> <div class='card-face question'> <div class='question-content'> <!--³--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "3" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='111' id='card-480550311'> <div class='header'> 111 </div> <div class='card-face question'> <div class='question-content'> <!--⁴--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "4" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='112' id='card-480550318'> <div class='header'> 112 </div> <div class='card-face question'> <div class='question-content'> <!--⁵--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "5" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='113' id='card-480550327'> <div class='header'> 113 </div> <div class='card-face question'> <div class='question-content'> <!--⁶--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "6" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='114' id='card-480550334'> <div class='header'> 114 </div> <div class='card-face question'> <div class='question-content'> <!--⁷--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "7" </div> </div> </div> <div class='flashcard-row thin-card' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-number='115' id='card-480550341'> <div class='header'> 115 </div> <div class='card-face question'> <div class='question-content'> <!--⁸--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "8" </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='116' id='card-480550346'> <div class='header'> 116 </div> <div class='card-face question'> <div class='question-content'> <!--⁹--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "9" </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='117' id='card-480550355'> <div class='header'> 117 </div> <div class='card-face question'> <div class='question-content'> <!--#8304--> </div> </div> <div class='card-face answer'> <div class='answer-content'> * superscript "0" </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='118' id='card-480104937'> <div class='header'> 118 </div> <div class='card-face question'> <div class='question-content'> <code> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Inline element with content styled in a fashion intended to indicate that the text is a short fragment of computer code (by default, the text is in monospace font). **Remember to always nest a <code> element within a <pre> element to preserve the coding layout. * *Use char entities to avoid conflict with active coding. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='119' id='card-480104938'> <div class='header'> 119 </div> <div class='card-face question'> <div class='question-content'> <var> </div> </div> <div class='card-face answer'> <div class='answer-content'> * A phrase tag used to define a variable in programming or in a mathematical expression. * The content inside is typically displayed in italics. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='120' id='card-480104942'> <div class='header'> 120 </div> <div class='card-face question'> <div class='question-content'> <sample> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Encloses inline text which represents sample (or quoted) output from a computer program. * Contents are typically rendered using the browser's default monospaced font (such as Courier or Lucida Console). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='121' id='card-480249777'> <div class='header'> 121 </div> <div class='card-face question'> <div class='question-content'> <data> </div> </div> <div class='card-face answer'> <div class='answer-content'> * links a given piece of content with a machine-readable translation: used to add a machine-readable translation of a given content * This element provides both a machine-readable value for data processors, and a human-readable value for rendering in a browser. **If the content is time- or date-related, the <time> element must be used. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='122' id='card-480249781'> <div class='header'> 122 </div> <div class='card-face question'> <div class='question-content'> <time> </div> </div> <div class='card-face answer'> <div class='answer-content'> * represents a specific period in time (time on a 24hr clock; a precise Gregorian calendar date; a valid time duration). * It may include the datetime attribute to translate dates into machine-readable format, (*allowing for better search engine results or custom features such as reminders). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='123' id='card-480249782'> <div class='header'> 123 </div> <div class='card-face question'> <div class='question-content'> datetime attribute </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies date and time of inserted and deleted text. * Represents the date and time of the <time> element. * Attribute Values: ( YYYY-MM-DDThh:mm:ssTZD (*valid format for datetime value)) : YYYY = year; MM = month; DD = day; T = required separator; hh = hour (Zulu time); mm = minute; ss = second; T = required separator; ZD = Time Zone Designator (Z for Zulu (a.k.a. Greenwich Mean Time) * ? time object (e.g. 40) ? </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='124' id='card-480249783'> <div class='header'> 124 </div> <div class='card-face question'> <div class='question-content'> <abbr> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The abbreviation element is used along with a title attribute to associate a full-text explanation with an abbreviation or acronym. * Full-text is only seen by website visitor using hovering cursor * Browsers, search engines, and assistive technologies do see and use full-text. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='125' id='card-480249784'> <div class='header'> 125 </div> <div class='card-face question'> <div class='question-content'> <cite> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The Citation element is used to reference a cited creative work, * must include the title of that work. * May be in an abbreviated form according to context-appropriate conventions </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='126' id='card-480249786'> <div class='header'> 126 </div> <div class='card-face question'> <div class='question-content'> <dfn> </div> </div> <div class='card-face answer'> <div class='answer-content'> * the "definition element", and it specifies a term that is going to be defined within the content. * nearest parent tag must also contain the definition/explanation </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='127' id='card-480249793'> <div class='header'> 127 </div> <div class='card-face question'> <div class='question-content'> <kbd> </div> </div> <div class='card-face answer'> <div class='answer-content'> * a span of inline text denoting textual user input from a keyboard, voice input, or any other text entry device. * content displayed in the browser's default monospace font. * This tag is not deprecated. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='128' id='card-480249794'> <div class='header'> 128 </div> <div class='card-face question'> <div class='question-content'> <meter> </div> </div> <div class='card-face answer'> <div class='answer-content'> * defines a scalar measurement within a known range / fractional value. (a.k.a. a gauge). * Must include a value attribute; should not be used to indicate progress; should include alternate text describing the state of the gauge. * may include min or max attributes to define the range with default range being 0-1 assumed; low or high attributes effectively create a three-level sub-optimal range </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='129' id='card-480249795'> <div class='header'> 129 </div> <div class='card-face question'> <div class='question-content'> <summary> </div> </div> <div class='card-face answer'> <div class='answer-content'> * specifies a summary, caption, or legend for a <details> element's disclosure box. * toggles the state of the parent <details> element open and closed. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='130' id='card-480249796'> <div class='header'> 130 </div> <div class='card-face question'> <div class='question-content'> title attribute </div> </div> <div class='card-face answer'> <div class='answer-content'> * used to specify extra information about the element. * Hovering cursor reveals the information -most often as a tooltip text </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='131' id='card-480249797'> <div class='header'> 131 </div> <div class='card-face question'> <div class='question-content'> keycode </div> </div> <div class='card-face answer'> <div class='answer-content'> * This property of a KeyboardEvent is used for returning the Unicode character code of the key that has been used to trigger an onkeypress event. ... * The key codes represent an actual key on the keyboard whereas character codes represent an ASCII character. **(The keyCode property is deprecated: It should be avoided to prevent RUN-TIME ERRORS in the future) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='132' id='card-480249798'> <div class='header'> 132 </div> <div class='card-face question'> <div class='question-content'> <bdi> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Stands for Bi-Directional Isolation: Tells the browser's bidirectional algorithm to treat the text it contains in isolation from its surrounding text. * It's particularly useful when a website dynamically inserts some text and doesn't know the directionality of that text (Without, right-to-left languages are read back-to-front). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='133' id='card-480249799'> <div class='header'> 133 </div> <div class='card-face question'> <div class='question-content'> <details> </div> </div> <div class='card-face answer'> <div class='answer-content'> * specifies additional details that the user can open and close on demand. * By default, the widget is closed. When open, it expands, and displays the content within. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='134' id='card-480249815'> <div class='header'> 134 </div> <div class='card-face question'> <div class='question-content'> <bdo> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Bidirectional Text Override element * Overrides the current directionality of text, so that the text within is rendered in a different direction (Without the bi-directional override, right-to-left languages are read back-to-front). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='135' id='card-480249816'> <div class='header'> 135 </div> <div class='card-face question'> <div class='question-content'> dir </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies the text direction of the element's content * It is essential to support languages that use right-to-left scripts such as Adlam, Arabic, Hebrew, N'Ko, Syriac, and Thaana. * Possible attribute values: ltr - (default) Left-to-right text direction; rtl - Right-to-left text direction; auto - Let the browser figure out the text direction, based on the content (only recommended if the text direction is unknown) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='136' id='card-480249817'> <div class='header'> 136 </div> <div class='card-face question'> <div class='question-content'> <ruby> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Represents small annotations rendered above, below, or next to base text and usually used for showing the pronunciation of East Asian characters. * Can also be used for annotating other kinds of text, but this usage is less common. * Don’t confuse the ruby annotation with the Ruby programming language </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='137' id='card-480249821'> <div class='header'> 137 </div> <div class='card-face question'> <div class='question-content'> <rb> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Marks the base text component of a <ruby> annotation which are used in East Asian typography. * must be nested inside a <ruby> element. * can have both semantic (<rtc>) and pronunciation (<rt>) annotations </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='138' id='card-480249822'> <div class='header'> 138 </div> <div class='card-face question'> <div class='question-content'> <rp> </div> </div> <div class='card-face answer'> <div class='answer-content'> * used to provide parentheses around a ruby text, to be shown by browsers that do not support ruby annotations. * optional element used together with <ruby> and <rt> defining what to show for the unsupportive browsers </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='139' id='card-480249823'> <div class='header'> 139 </div> <div class='card-face question'> <div class='question-content'> <rt> </div> </div> <div class='card-face answer'> <div class='answer-content'> * An inline element specifying the ruby text component of a ruby annotation used to provide pronunciation, translation, or transliteration information for East Asian typography. * Use <rt> together with <ruby> and <rp> </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='140' id='card-480249824'> <div class='header'> 140 </div> <div class='card-face question'> <div class='question-content'> <rtc> </div> </div> <div class='card-face answer'> <div class='answer-content'> * marks the ruby text container for ruby text components in a ruby annotation * specifies semantic annotations of characters that are presented in <rb> elements used inside a <ruby> </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='141' id='card-480249829'> <div class='header'> 141 </div> <div class='card-face question'> <div class='question-content'> hyperlink </div> </div> <div class='card-face answer'> <div class='answer-content'> * a link from a hypertext file or document to another location or file, typically activated by clicking on a highlighted word or image on the screen. * Each webpage hyperlink is sensitive to three interactive states: Hover, Active, and Visited. * Browsers distinguish links with underlining or colored borders typically. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='142' id='card-480249830'> <div class='header'> 142 </div> <div class='card-face question'> <div class='question-content'> accesskey </div> </div> <div class='card-face answer'> <div class='answer-content'> * Are the keyboard shortcuts to activate/focus specific elements (It supports all HTML elements), and are browser-dependent (may vary from browser to browser) * Designate a character key (must be any, single keyboard character) as specified for a particular hyperlink through the use of the accesskey attribute of an anchor tag * Utilize the shortcuts thus: “Alt+accesskey” for most browsers; “Alt+Shift+accesskey” for Firefox; “Cmd+accesskey” for Mac [and Apple?] users. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='143' id='card-480249831'> <div class='header'> 143 </div> <div class='card-face question'> <div class='question-content'> 3 ways to access hyperlinks </div> </div> <div class='card-face answer'> <div class='answer-content'> * Pointer: hover cursor over hyperlink and click * Tab: repeatedly hit Tab until hyperlink is selected, then, click Enter. * Access key: hit a designated character key to focus on hyperlink and click Enter to activate. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='144' id='card-480249832'> <div class='header'> 144 </div> <div class='card-face question'> <div class='question-content'> Fragment links </div> </div> <div class='card-face answer'> <div class='answer-content'> * A short string of characters that refers to a resource that is subordinate to another, primary resource. * In a separate doc, the fragment identifier introduced by a hash mark # is the optional last part of a URL typically used to identify a portion of that doc: In the same doc, the fragment is specified to a hyperlink in the anchor’s href attribute (beginning with a #), and is specified in the target element by its id attribute. * Example code: <p id=”top”>...</p> (target element) <a href=”index.html#top”>Top</a> (nav hyperlink to different doc) <a href=”#top”>Top</a> (site or page nav hyperlink) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='145' id='card-480249833'> <div class='header'> 145 </div> <div class='card-face question'> <div class='question-content'> <ul> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines an unordered list of items * Typically rendered as a bulleted list. * Use the <ul> tag together with the <li> tag to create unordered lists. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='146' id='card-480249834'> <div class='header'> 146 </div> <div class='card-face question'> <div class='question-content'> href protocols </div> </div> <div class='card-face answer'> <div class='answer-content'> * Typical- http//: … or https//: … (various nav hyperlinks) * Javascript- href=”javascript: …” (various JavaScript event hyperlinks) * Mailto- href=”... @ gmail.com” (auto-adds the email in the “To:” field hyperlink) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='147' id='card-480249854'> <div class='header'> 147 </div> <div class='card-face question'> <div class='question-content'> list-style-type property </div> </div> <div class='card-face answer'> <div class='answer-content'> * style attribute that specifies a Bullet’s style value of (disc(default style), circle, square, or none) * style attribute that specifies a counter’s style value of (Decimals, Roman numerals, Latin letters, Greek letters, Georgian numbers, Armenian numbers, or none(to suppress numbering)) * Ex coding- ( <ul style=”list-style-type: square”> … </ul> ) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='148' id='card-480249856'> <div class='header'> 148 </div> <div class='card-face question'> <div class='question-content'> <li> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The list item is used inside ordered lists(<ol>), unordered lists (<ul>), and in menu lists (<menu>). * Contains individual list items </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='149' id='card-480249857'> <div class='header'> 149 </div> <div class='card-face question'> <div class='question-content'> list-style-image property </div> </div> <div class='card-face answer'> <div class='answer-content'> * style attribute that specifies that the list-style-image property replaces the list-item marker with an image. * Note: Always specify the list-style-type property in addition (This property is used if the image for some reason is unavailable). * Ex coding- ( <ul style=”list-style-image: ‘Daigle-turquoise-small.jpg’”> … </ul> ) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='150' id='card-480249859'> <div class='header'> 150 </div> <div class='card-face question'> <div class='question-content'> <ol> </div> </div> <div class='card-face answer'> <div class='answer-content'> * In the ordered list, each list item is preceded by a numerical or alphabetical identifier (as opposed to bullets or no identifier) (CSS: the bullets and counters (numbers, etc.) are displayed in the padding) * The automatic counters that differentiate Ordered list items from regular text may be one of these six types:.Decimals, Roman numerals, Latin letters, Greek letters, Georgian numbers, or Armenian numbers or none (to suppress numbering) * A start attribute can be specified to set a different starting point than the Traditional Counting starting point (start with 5 instead of 1). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='151' id='card-480249860'> <div class='header'> 151 </div> <div class='card-face question'> <div class='question-content'> <dl> </div> </div> <div class='card-face answer'> <div class='answer-content'> * a description list encloses a list of groups of terms (specified using the <dt> element) and descriptions (provided by <dd> elements). * Common uses: implement a glossary or to display metadata (a list of key-value pairs).(<dl>’s are useful to contain a series of questions and related answers, or any other groups of name/value data). . * <dl>’s can contain Multiple terms for a single description or definition, or they can contain multiple definitions or descriptions for a single term. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='152' id='card-480249864'> <div class='header'> 152 </div> <div class='card-face question'> <div class='question-content'> <dt> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The <dt> tag defines a term/name in a description list (<dl>’s are useful to contain a series of questions and related answers, or any other groups of name/value data). * The <dt> tag is used in conjunction with <dd> (describes each term/name) and both are nested in <dl> (defines a description list) * The <dt> alone does not indicate a term being defined: that requires a <dfn> nested within the <dt>. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='153' id='card-480249865'> <div class='header'> 153 </div> <div class='card-face question'> <div class='question-content'> <tr> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines a row in an HTML table. * Are nested within a table element * Each table row must contain the same number of data cells (for the purpose of maintaining understandable table columns) * Contains one or more <th> or <td> elements. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='154' id='card-480249866'> <div class='header'> 154 </div> <div class='card-face question'> <div class='question-content'> <dd> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The definition description comes in tandem with its term, <dt>; is nested in a <dl> description list; and defines or describes a list item (<dl>’s are useful to contain a series of questions and related answers, or any other groups of name/value data). * Paragraphs, line breaks, images, links, lists, etc. can be inserted inside </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='155' id='card-480249867'> <div class='header'> 155 </div> <div class='card-face question'> <div class='question-content'> <table> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Allows web developers to arrange data into rows and columns. * Consists of table cells inside rows and columns * An HTML table has two kinds of cells: <th> and <td> * Will typically contain multiple table rows </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='156' id='card-480249868'> <div class='header'> 156 </div> <div class='card-face question'> <div class='question-content'> <td> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines a standard data cell in an HTML table. * Table data cells are nested within table rows * * The closing tag for data cells can be omitted * Text in <td> elements are regular and left-aligned by default. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='157' id='card-480249883'> <div class='header'> 157 </div> <div class='card-face question'> <div class='question-content'> <caption> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines a table caption. * Must immediately follow the opening table tag * * By default, a table caption will be center-aligned above a table (CSS properties text-align and caption-side can be used to align and place the caption). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='158' id='card-480249888'> <div class='header'> 158 </div> <div class='card-face question'> <div class='question-content'> Rowspan </div> </div> <div class='card-face answer'> <div class='answer-content'> * Attribute to a table data element to merge data cells * (Cells in the spanned rows must then be removed to maintain table symmetry) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='159' id='card-480249889'> <div class='header'> 159 </div> <div class='card-face question'> <div class='question-content'> <th> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The table heading element is used to add row and column headings * Number of headings must exactly match the number of rows and columns. * * Closing tag is optional. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='160' id='card-480249890'> <div class='header'> 160 </div> <div class='card-face question'> <div class='question-content'> <tfoot> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Used in conjunction with the <thead> and <tbody> elements, the table footer groups special table info beneath the table content (table data should not appear here). * Browsers can use these elements to enable scrolling of the table body independently of the header and footer. * These elements can enable the table header and footer to be printed at the top and bottom of each page. * Note: The <tfoot> element must have one or more <tr> tags inside. * The <tfoot> tag must be used in the following context: As a child of a <table> element, after any <caption>, <colgroup>, <thead>, and <tbody> elements. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='161' id='card-480249891'> <div class='header'> 161 </div> <div class='card-face question'> <div class='question-content'> <thead> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The table header contains special table info before the table content * Must appear before the table body but after the caption (if one is present) * Table data should not appear here </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='162' id='card-480249892'> <div class='header'> 162 </div> <div class='card-face question'> <div class='question-content'> <tbody> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Used to group the body content in an HTML table. * When a table header and/or footer is present, the table rows must all be placed within a table body (which is placed after the header and before the footer) * In long tables, multiple table bodies can be used. * The <tbody> element is used in conjunction with the <thead> and <tfoot> elements. * Browsers can use these elements to enable scrolling of the table body independently of the header and footer. * Note: The <tbody> element must have one or more <tr> tags inside. * The <tbody> tag must be used in the following context: As a child of a <table> element, after any <caption>, <colgroup>, and <thead> elements. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='163' id='card-480249901'> <div class='header'> 163 </div> <div class='card-face question'> <div class='question-content'> <col> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Column tags can specify greater control over column width and appearance. * (The default width for a column is the width of the column content) * No closing tag * The <col> tag specifies column properties for each column within a <colgroup> element. * Useful for applying styles to entire columns, instead of repeating the styles for each cell, for each row. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='164' id='card-480249932'> <div class='header'> 164 </div> <div class='card-face question'> <div class='question-content'> Colspan </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines the number of columns a table cell should span. * Specifies that the parameters and rules of one <th> or <td> is represented/applied over multiple columns. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='165' id='card-480249933'> <div class='header'> 165 </div> <div class='card-face question'> <div class='question-content'> Span </div> </div> <div class='card-face answer'> <div class='answer-content'> * This attribute specifies that the parameters and rules of one column is represented/applied over multiple columns * The span attribute can be used with the <col> or <colgroup> elements. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='166' id='card-480249934'> <div class='header'> 166 </div> <div class='card-face question'> <div class='question-content'> <colgroup> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies a group of one or more columns in a table for formatting allowing styling of both column groups and individual columns. * Useful for applying styles to entire columns, instead of repeating the styles for each cell, for each row. * Note: Must be a child of a <table> element, after any <caption> elements and before any <thead>, <tbody>, <tfoot>, and <tr> elements. * Tip: To define different properties to a column within a grouping, use the <col> tag within this grouping tag. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='167' id='card-480249935'> <div class='header'> 167 </div> <div class='card-face question'> <div class='question-content'> <img> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Adds an image to an HTML doc * Preferably includes these attributes: src, width, height, alt * It is more efficient to adjust an image with a graphics editor to the actual dimensions of the content area it will occupy </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='168' id='card-480249936'> <div class='header'> 168 </div> <div class='card-face question'> <div class='question-content'> width </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies the width of an element, in pixels. * Can be used on the following elements: canvas, embed, iframe, img, input, object, and video * <img> : Recommended to specify the pixel width of the content area the image will occupy on the page * <img> ** Only scale an image down from the actual image size: Scaling up causes pixelation of the image. * <img> The image size need not be exact to the specified content area, but the h*w proportion should be maintained to avoid distortion in the image. * Note: For input elements, the width attribute is used only with <input type="image">. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='169' id='card-480249937'> <div class='header'> 169 </div> <div class='card-face question'> <div class='question-content'> height </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies the height of the element, in pixels. * Can be used on the following elements: canvas, embed, iframe, img, input, object, and video * <img> Recommended to specify the pixel height of the area the image will occupy on the page (only scale an image down from the actual image size: Scaling up causes pixelation of the image) * <img> The image size need not be exact to the specified content area, but the h*w proportion should be maintained to avoid distortion in the image. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='170' id='card-480249938'> <div class='header'> 170 </div> <div class='card-face question'> <div class='question-content'> src </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies the location (URL) of an external resource by either its absolute or relative path. * The src attribute can be used on the following elements: Audio, embed, iframe, img, input, script, source, track, and video </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='171' id='card-480261794'> <div class='header'> 171 </div> <div class='card-face question'> <div class='question-content'> alt </div> </div> <div class='card-face answer'> <div class='answer-content'> * Provides alternative information for an image if a user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader). * Can be used on the following elements: area, img, and input. * <area> (* validation will fail unless each area tag includes an alt attribute). * Note: Required for the <img> element. * Note: For <input> elements, can only be used with <input type="image">. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='172' id='card-480261795'> <div class='header'> 172 </div> <div class='card-face question'> <div class='question-content'> bmp </div> </div> <div class='card-face answer'> <div class='answer-content'> * Bitmap file format for web graphics ** Should avoid for web graphics as the file sizes are quite large. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='173' id='card-480261799'> <div class='header'> 173 </div> <div class='card-face question'> <div class='question-content'> png </div> </div> <div class='card-face answer'> <div class='answer-content'> * The Portable Network Graphics file format is designed to transfer images on the internet (with some applications, with lots of editing effects). * Optimum file type for web bitmap graphics: popular and non-proprietary (openly-published specification that anyone can use: no copyright limitations) * The most frequently used uncompressed raster image format on the internet (raster: a rectangular pattern of parallel scanning lines followed by the electron beam on a tv screen or monitor). * Lossless data compression format (file's size is reduced with no loss of quality) created to replace the .gif file. * Has the ability to display transparent backgrounds. Capable of containing 24bit RGB color palettes and greyscale images. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='174' id='card-480261800'> <div class='header'> 174 </div> <div class='card-face question'> <div class='question-content'> Single image targeting multiple hyperlink resources </div> </div> <div class='card-face answer'> <div class='answer-content'> * Possible if an image map is added to define hotspot areas for each hyperlink * Required: the image tag must include a usemap attribute to specify a map name prefix by a hashtag * The image map itself is contained between <map> tags and it's name is specified by a name attribute. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='175' id='card-480261801'> <div class='header'> 175 </div> <div class='card-face question'> <div class='question-content'> <map> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Used to define an image map (an image with clickable areas). * The required “name” attribute is associated with the <img>'s usemap attribute and creates a relationship between the image and the map. * Contains a number of <area> elements that define the clickable areas in the image map. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='176' id='card-480261802'> <div class='header'> 176 </div> <div class='card-face question'> <div class='question-content'> usemap </div> </div> <div class='card-face answer'> <div class='answer-content'> * To use an image map the img tag must include this attribute to specify a map name prefixed by a hashtag character * Specifies an image (or an object) as an image map (an image with clickable areas). * Associated with a <map> element's name or id attribute, and creates a relationship between the <img> and the <map>. * * Note: The usemap attribute cannot be used if the <img> element is a descendant of an <a> or <button> element. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='177' id='card-480261803'> <div class='header'> 177 </div> <div class='card-face question'> <div class='question-content'> name </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies a name for an HTML element. * Can be used to reference the element in a JavaScript. * <form> Used as a reference when the data is submitted. * <iframe> Can be used to target a form submission. * <map> Associated with the <img>'s usemap attribute and creates a relationship between the image and the map. * <meta> Specifies a name for the information/value of the content attribute. * <param> Used together with the value attribute to specify parameters for the plugin specified with the <object> tag. * Can be used on the following elements: button, fieldset, form, Iframe, input, map, meta, object, output, param, select, textarea. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='178' id='card-480261804'> <div class='header'> 178 </div> <div class='card-face question'> <div class='question-content'> <area> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines an area inside an image map (an image with clickable areas). * Each image area becoming a hyperlink hotspot is defined by 4 attributes of this element: shape, coords, href, and alt. * Always nested inside a <map> tag. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='179' id='card-480261805'> <div class='header'> 179 </div> <div class='card-face question'> <div class='question-content'> shape </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies the shape of an area. (specifies value as: rect, circle, or poly). * Used together with the coords attribute to specify the size, shape, and placement of an area. * Can be used on the area element. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='180' id='card-480261806'> <div class='header'> 180 </div> <div class='card-face question'> <div class='question-content'> coords </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies the coordinates of an area in an image map. * Used together with the shape attribute to specify the size, shape, and placement of an area. * * Tip: The coordinates of the top-left corner of an area are 0,0. * Rect : The coordinate attributes specifies a comma-separated list of its x-axis and y-axis coordinates shape : top-left x, top-left y, bottom-right x, and bottom-right y * Circle : Center x, Center y, radius * Poly : x1,y1,x2,y2,x3,y3,etc. - One pair for each point. The first and final point must have identical coordinates to complete the shape (** DO NOT LEAVE ANY SPACES IN THE COMMA-SEPARATED LIST OF COORDINATES). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='181' id='card-480261828'> <div class='header'> 181 </div> <div class='card-face question'> <div class='question-content'> href </div> </div> <div class='card-face answer'> <div class='answer-content'> * Each area tag must have an href attribute to specify the hyperlink’s target * The href attribute can be used on the following elements: <a>, <area>, <base>, and <link>. * <a> or <area> Specifies the URL of the page the link goes to. * <base> Specifies the base URL for all relative URLs on a page. * <link> Specifies the location (URL) of the external resource (most often a style sheet file). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='182' id='card-480261830'> <div class='header'> 182 </div> <div class='card-face question'> <div class='question-content'> <figure> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies SELF-CONTAINED CONTENT, like illustrations, diagrams, photos, code listings, etc. * Additional means to insert images into a web page: an image tag can be nested within this element. In effect now making it self contained. * Element content is related to the main flow, but its position is independent of the main flow and should not affect the doc flow. * Embeds an image related to the main text content but whose removal would not disrupt the text’s meaning: image can now be positioned away from the text and referenced by a caption. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='183' id='card-480261831'> <div class='header'> 183 </div> <div class='card-face question'> <div class='question-content'> <figcaption> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines a caption for a <figure> element. * Can be placed as the first or last child of the <figure> element. * A figure should be referred to by its label </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='184' id='card-480261833'> <div class='header'> 184 </div> <div class='card-face question'> <div class='question-content'> <picture> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Used to contain multiple image sources from which the browser can select the most appropriate size for different devices or screen sizes giving web developers more flexibility in specifying image resources (selection can include totally different images).. * Contains one or more <source> elements, each referring to different images through the srcset attribute. * Each <source> element has a media attribute that defines when the image is the most suitable. * * Can enclose a final regular img element to specify the image to be displayed on older web browsers not supporting the multiple image selection feature. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='185' id='card-480261854'> <div class='header'> 185 </div> <div class='card-face question'> <div class='question-content'> srcset </div> </div> <div class='card-face answer'> <div class='answer-content'> * defines the set of images we will allow the browser to choose between, and what size each image is. * This attribute is required when <source> is used in <picture>. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='186' id='card-480261855'> <div class='header'> 186 </div> <div class='card-face question'> <div class='question-content'> <source> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Used to specify multiple media resources for media elements, such as <video>, <audio>, and <picture> : each source contained within one of these parent elements Is specified to one of this nested element. * Allows you to specify alternative video/audio/image files which the browser may choose from, based on browser support or viewport width. The browser will choose the first one it supports. * Does not require a closing tag </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='187' id='card-480261856'> <div class='header'> 187 </div> <div class='card-face question'> <div class='question-content'> media </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies what media/device the linked document is optimized for: target URL is designed for special devices (like iPhone) , speech or print media. * Specifies the minimum screen width suitable for the source element image (Ex. coding: media=”(min-width : 500px)” ) * Can accept several values. * The media attribute can be used on the following elements: <a>, <area>, <link>, <source>, and <style>. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='188' id='card-480261857'> <div class='header'> 188 </div> <div class='card-face question'> <div class='question-content'> Min-width property </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines the minimum width of an element. * Property of the media attribute of a source element which assigns a minimum screen-width requirement In order for an image to be displayed on a specific device. * Content is smaller than the minimum width, the minimum width will be applied. * Content is larger than the minimum width: has no effect. * Note: This maintains the width of an element. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='189' id='card-480261858'> <div class='header'> 189 </div> <div class='card-face question'> <div class='question-content'> <object> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines an external resource to be embedded into an HTML document * Can specify dimensions to width and height attributes; * When appropriate, can include a usemap attribute; * Fall-back text can be included in the object element * Can specify the resources URL to its data attribute and the resource type to its type attribute ***Must contain at least one data attribute OR one type attribute: The resource type must be a valid MIME type describing the resource. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='190' id='card-480261859'> <div class='header'> 190 </div> <div class='card-face question'> <div class='question-content'> <embed> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines a container for an external resource, such as a web page, a picture, a media player, or a plug-in application. * Integrates an external resource for interaction with the HTML document *** Picture display: better to use an <img> ; HTML display: better to use <iframe> ; Video or audio display: better to use <video> or <audio>. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='191' id='card-480261860'> <div class='header'> 191 </div> <div class='card-face question'> <div class='question-content'> SVG </div> </div> <div class='card-face answer'> <div class='answer-content'> * Scalable vector graphics are supported by web browsers that support modern HTML * Vector graphics store the graphic information as a series of paths: highly efficient way to describe graphics. * Can be scaled without a loss of fidelity; can be enlarged without suffering pixelation ; can be zoomed without a loss of definition and can be printed without a loss of resolution; * Can be given JavaScript functionality: it can be animated; * Can be embedded in HTML by specifying the MIME type of “image/svg+xml” to the <embed> element’s type attribute </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='192' id='card-480261861'> <div class='header'> 192 </div> <div class='card-face question'> <div class='question-content'> <iframe> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Creates a fixed area on a page in which to display an embedded external resource * The inline frame’s dimensions must be specified to the element's width and height attributes (Where the resource exceeds these dimensions, the browser provides the scroll bar); the URL of the external resource is specified to its src attribute; * May optionally contain a name attribute to specify a unique identifier for that frame. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='193' id='card-480261862'> <div class='header'> 193 </div> <div class='card-face question'> <div class='question-content'> target </div> </div> <div class='card-face answer'> <div class='answer-content'> * Can be used on the following elements: <a>, <area>, <base>, and <form>. * <a> and <area>: Specifies where to open the linked document. * <base>: Specifies the default target for all hyperlinks and forms in the page. * <form>: Specifies a name or a keyword that indicates where to display the response that is received after submitting the form. * Optional : defaults to _self when no value is provided. * It is not supported by HTML 5. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='194' id='card-480261863'> <div class='header'> 194 </div> <div class='card-face question'> <div class='question-content'> <audio> </div> </div> <div class='card-face answer'> <div class='answer-content'> * embeds sound content in documents: * may contain one or more audio sources: represented using the src attribute or the <source> element (the browser will choose the most suitable one). It can also be the destination for streamed media, using a MediaStream * Fall back message can be included here * Include an id attribute so as to be referenced </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='195' id='card-480261864'> <div class='header'> 195 </div> <div class='card-face question'> <div class='question-content'> autoplay </div> </div> <div class='card-face answer'> <div class='answer-content'> * Boolean attribute * Specifies the browser should immediately begin playing the audio resource * avoid automatic audio playback I'm website as many users detest the auto-play feature </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='196' id='card-480261865'> <div class='header'> 196 </div> <div class='card-face question'> <div class='question-content'> loop </div> </div> <div class='card-face answer'> <div class='answer-content'> * Boolean attribute * Specifies the browser should play the audio or video resource again every time it is finished. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='197' id='card-480261866'> <div class='header'> 197 </div> <div class='card-face question'> <div class='question-content'> controls </div> </div> <div class='card-face answer'> <div class='answer-content'> * Boolean attribute * Specifies the browser should display user controls (such as a play/pause button etc) to start or stop the audio or video playing. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='198' id='card-480261873'> <div class='header'> 198 </div> <div class='card-face question'> <div class='question-content'> preload </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies if and how the author thinks the video should be loaded when the page loads. * Accepts values of auto or none to suggest the browser should load the audio resource so it is ready to play </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='199' id='card-480261874'> <div class='header'> 199 </div> <div class='card-face question'> <div class='question-content'> Codec </div> </div> <div class='card-face answer'> <div class='answer-content'> * Coder-decoder * Codes audio and/or video resources so they can be played * Not all browsers incorporate the same audio or video codec </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='200' id='card-480261875'> <div class='header'> 200 </div> <div class='card-face question'> <div class='question-content'> AAC </div> </div> <div class='card-face answer'> <div class='answer-content'> * Advanced Audio Coding * Supported by modern browsers such as Google Chrome, Firefox, and Microsoft Edge for MP3 audio * An audio coding standard for lossy (unnecessary information is discarded) digital audio compression. * Designed as MP3 format successor, generally achieves higher sound quality than MP3 encoders at the same bit rate. * Has been standardized by ISO and IEC as part of the MPEG-2 and MPEG-4 specifications. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='201' id='card-480261920'> <div class='header'> 201 </div> <div class='card-face question'> <div class='question-content'> OGG </div> </div> <div class='card-face answer'> <div class='answer-content'> * An open, bitstream container file format for audio, video, and other multimedia content. * Designed to provide for efficient streaming and manipulation of high quality digital multimedia: the Ogg container format can multiplex (communicates two or more signals over a common channel) a number of independent streams for audio, video, text, and metadata. * Codec “vorbis” </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='202' id='card-480261924'> <div class='header'> 202 </div> <div class='card-face question'> <div class='question-content'> Absence of a universal codec across all browsers </div> </div> <div class='card-face answer'> <div class='answer-content'> * Requires audio resources to be encoded twice for playback across all browsers * For this purpose two source elements may be nested within an audio element : rather than specifying a single resource URL to a src attribute in the audio tag * For each file format, the source element can then specify their resource URL to a src attribute and they're MIME type to a type attribute ( the browser will only load the supported audio resource for playback) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='203' id='card-480261927'> <div class='header'> 203 </div> <div class='card-face question'> <div class='question-content'> <video> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Embeds video content in a document, such as a movie clip or other video streams. * The <video> tag contains one or more <source> tags with different video sources. The browser will choose the first source it supports. * The text between the <video> and </video> tags will only be displayed in browsers that do not support the <video> element. * Include an id attribute so as to be referenced. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='204' id='card-480261928'> <div class='header'> 204 </div> <div class='card-face question'> <div class='question-content'> muted </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies that the audio output of an audio or video resource should be muted. * A Boolean attribute. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='205' id='card-480261931'> <div class='header'> 205 </div> <div class='card-face question'> <div class='question-content'> poster </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies an image to be shown while the video is downloading, or until the user hits the play button. * If this is not included, the first frame of the video will be used instead. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='206' id='card-480261932'> <div class='header'> 206 </div> <div class='card-face question'> <div class='question-content'> Video display area </div> </div> <div class='card-face answer'> <div class='answer-content'> * It is a good idea to always include width and height attributes: If height and width are not set, the page might flicker while the video loads. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='207' id='card-480261933'> <div class='header'> 207 </div> <div class='card-face question'> <div class='question-content'> Video compression standards </div> </div> <div class='card-face answer'> <div class='answer-content'> * There are many video formats out there. * The MP4, WebM, and Ogg formats are supported by HTML.(Only these three are supported by the HTML Standard) * The MP4 format is recommended by YouTube. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='208' id='card-480261934'> <div class='header'> 208 </div> <div class='card-face question'> <div class='question-content'> AVC </div> </div> <div class='card-face answer'> <div class='answer-content'> * Advanced Video Coding-a patented standard that is also known as H.264 or MPEG-4 (.mp4 files) * Video compression standard based on block-oriented, motion-compensated coding. * It is by far the most commonly used format for the recording, compression, and distribution of video content, used by 91% of video industry developers as of September 2019. * It supports resolutions up to and including 8K UHD. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='209' id='card-480261947'> <div class='header'> 209 </div> <div class='card-face question'> <div class='question-content'> WEBM </div> </div> <div class='card-face answer'> <div class='answer-content'> * An open, royalty free alternative to the patented H. 264 and MPEG-4 standard * .webm files * Designed for sharing video on the web. * WebM uses a container structure similar to the Matroska (.MKV) video format, which stores both audio and video data. * Video is compressed using a VP8 or VP9 codec, and audio is compressed with either the Vorbis or Opus audio codec. * Several modern web browsers, such as Chrome, Edge, and Firefox, include built-in support for the WebM format. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='210' id='card-480261948'> <div class='header'> 210 </div> <div class='card-face question'> <div class='question-content'> HTML video formats </div> </div> <div class='card-face answer'> <div class='answer-content'> * MP4 * WebM * OGG </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='211' id='card-480261949'> <div class='header'> 211 </div> <div class='card-face question'> <div class='question-content'> <track> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Used as a child of the media elements, <audio> and <video> * Specifies timed text tracks (or time-based data): specifies subtitles, caption files or other files containing text, that should be visible when the media is playing. * Tracks are formatted in WebVTT format (.vtt files). * * src attribute is required. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='212' id='card-480261954'> <div class='header'> 212 </div> <div class='card-face question'> <div class='question-content'> WebVTT </div> </div> <div class='card-face answer'> <div class='answer-content'> * Web Video Text Tracks format’s main use is for marking up external text track resources in connection with the HTML <track> element. * Provides captions or subtitles for video content, and also text video descriptions [MAUR], chapters for content navigation, and more generally any form of metadata that is time-aligned with audio or video content. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='213' id='card-480261955'> <div class='header'> 213 </div> <div class='card-face question'> <div class='question-content'> Subtitle files </div> </div> <div class='card-face answer'> <div class='answer-content'> * Begins with WEBVTT * Start and end timing cues are added on new lines in the format - “HH:MM:SS.ss” and separated by ” -–> “ * The associated subtitle caption appears on a new line below each timing cue. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='214' id='card-480261956'> <div class='header'> 214 </div> <div class='card-face question'> <div class='question-content'> kind </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies the kind of text track * Values: captions, chapters, descriptions, metadata, and subtitles </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='215' id='card-480261957'> <div class='header'> 215 </div> <div class='card-face question'> <div class='question-content'> srclang </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies the language of the track text data * Required if kind="subtitles" </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='216' id='card-480261964'> <div class='header'> 216 </div> <div class='card-face question'> <div class='question-content'> default </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies that the track is to be enabled if the user's preferences do not indicate that another track would be more appropriate </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='217' id='card-480261965'> <div class='header'> 217 </div> <div class='card-face question'> <div class='question-content'> label </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies the title of the text track </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='218' id='card-480261966'> <div class='header'> 218 </div> <div class='card-face question'> <div class='question-content'> Script alternative to a controls attribute </div> </div> <div class='card-face answer'> <div class='answer-content'> * With the controls attribute omitted from audio and video tags, the JavaScript play() and pause() methods of an embedded media object can then be called to control playback from an on-click event-handler script function * The control will play or pause playback according to the Boolean value of the run variable </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='219' id='card-480261980'> <div class='header'> 219 </div> <div class='card-face question'> <div class='question-content'> <progress> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Displays an indicator showing the completion progress of a task, * Typically displayed as a progress bar. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='220' id='card-480261991'> <div class='header'> 220 </div> <div class='card-face question'> <div class='question-content'> max </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies how much work (or progress) the task requires in total. * Default value is 1 </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='221' id='card-480292068'> <div class='header'> 221 </div> <div class='card-face question'> <div class='question-content'> value </div> </div> <div class='card-face answer'> <div class='answer-content'> * Specifies how much of the task has been completed * Can be dynamically updated in synchronization with media playback from an ontimeupdate event-handler script function. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='222' id='card-480292069'> <div class='header'> 222 </div> <div class='card-face question'> <div class='question-content'> Ontimeupdate </div> </div> <div class='card-face answer'> <div class='answer-content'> * Event handler script function that can be used to dynamically update A progress element’s Completion percentage value in synchronization with media playback </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='223' id='card-480292070'> <div class='header'> 223 </div> <div class='card-face question'> <div class='question-content'> currentTime </div> </div> <div class='card-face answer'> <div class='answer-content'> * Property of an embedded media object which stores the elapsed time since playback began * Can be used along with the duration property to calculate playback progress as a percentage * Stores time in seconds as floating Point values, so needs to be rounded down with Math.floor( ) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='224' id='card-480292071'> <div class='header'> 224 </div> <div class='card-face question'> <div class='question-content'> duration </div> </div> <div class='card-face answer'> <div class='answer-content'> * Property of an embedded media object that stores total playback time * Can be used along with the currentTime property to calculate playback progress as a percentage * Stores time in seconds as floating Point values, so needs to be rounded down with Math.floor( ) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='225' id='card-480292073'> <div class='header'> 225 </div> <div class='card-face question'> <div class='question-content'> <template> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Element used as a container to hold some HTML content hidden from the user when the page loads. * A “DocumentFragment” object that script can copy and can later be added or removed by script as child elements. * You can use this tag if you have some HTML code you want to use over and over again, but not until you ask for it. ** The stylesheet must be included in this element or its rules will not be applied to this element’s child elements. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='226' id='card-480292074'> <div class='header'> 226 </div> <div class='card-face question'> <div class='question-content'> <slot> </div> </div> <div class='card-face answer'> <div class='answer-content'> * The element part of the web component technology which is a placeholder inside a component (template) that you simply can fill together with your own markup, which allows you to make separate DOM trees and represent them together. * Within the template element, this element’s contents can differ in each instance of the template * Optionally enclose default text, but must include a name attribute that will identify that element as a placeholder within the template. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='227' id='card-480292075'> <div class='header'> 227 </div> <div class='card-face question'> <div class='question-content'> slot </div> </div> <div class='card-face answer'> <div class='answer-content'> * By including this attribute, these type of placeholders are filled with content within an HTML element that nominates the matching name attribute value. * This attribute can only appear in these HTML tags: article, aside, block quote, body, div, footer, h1-6, header, main, nav, p, section, span. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='228' id='card-480292076'> <div class='header'> 228 </div> <div class='card-face question'> <div class='question-content'> <dialog> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines a dialog box or subwindow.To which the user must respond before regaining access to the web page * Makes it easy to create popup dialogs and modals on a web page. * Appears on a layer above all other page content and can contain all types of content but must provide some means of closing the dialog to return to the page Typically in the form of a button. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='229' id='card-480292077'> <div class='header'> 229 </div> <div class='card-face question'> <div class='question-content'> <button> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Enables a clickable button to be added to a web page or modal dialog: Text enclosed by these tags will appear on the button as its label. * Can include an onclick attribute to nominate a script function to be called when the button is clicked. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='230' id='card-480292078'> <div class='header'> 230 </div> <div class='card-face question'> <div class='question-content'> addEventListener </div> </div> <div class='card-face answer'> <div class='answer-content'> * Technique by which the script can dynamically add an event listener for each button to recognize when the user clicks a button - creating a click event. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='231' id='card-480292079'> <div class='header'> 231 </div> <div class='card-face question'> <div class='question-content'> <canvas> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Element used to draw graphics, on the fly, via scripting (usually JavaScript). * This tag is transparent and is only a container for graphics: you must use a script to actually draw the graphics. * Default canvas area is 300 pixels wide and 150 pixels high: other dimensions can be specified to the canvas element’s width and height attributes * Fall back text can be included in the element. * In order to use the canvas, a script must first create a “CanvasRenderingContext2D” object : this provides all the methods and properties needed to paint shapes and text in the canvas area. * A canvas can be repainted at frequent intervals by Script to create animations, create interactive games, etc.: In fact the possibilities provided by canvas are almost limitless. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='232' id='card-480292080'> <div class='header'> 232 </div> <div class='card-face question'> <div class='question-content'> Abyss </div> </div> <div class='card-face answer'> <div class='answer-content'> * Abyss Web Server X1 from Aprelium: (Free web server) : It is useful to have a web server installed on your system for web page development * You may prefer to start the web server manually whenever you need it, or set it to continually run in the background automatically. * The “htdocs” folder : location where you installed Abyss / where you will place your web pages during development (default page : index.html) * Enter IP address - 127.0.0.1:9999 to open the Abyss Web Server Console </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='233' id='card-480292081'> <div class='header'> 233 </div> <div class='card-face question'> <div class='question-content'> Most popular server-side scripting languages </div> </div> <div class='card-face answer'> <div class='answer-content'> * PHP * ASP.NET * Ruby * Perl * Python </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='234' id='card-480292083'> <div class='header'> 234 </div> <div class='card-face question'> <div class='question-content'> Python </div> </div> <div class='card-face answer'> <div class='answer-content'> * Free server-side scripting language available at ActiveState (installation is lengthy) * Change the installation folder name to “C:\Python\” * Command prompt launcher: Windows System folder on the Windows 10 Start menu * Note the Interpreter location, as you will need it to configure Abyss for Python scripting ***Indentation is used in Python to group statements, so indentation fidelity must be maintained </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='235' id='card-480292084'> <div class='header'> 235 </div> <div class='card-face question'> <div class='question-content'> Abyss –> Python </div> </div> <div class='card-face answer'> <div class='answer-content'> * The Abyss web server can execute using Python server-side script, * It must be configured to know the location on your system of the Python interpreter (python.exe). * It must be configured to recognize that files with the extension .py are Python scripts. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='236' id='card-480292085'> <div class='header'> 236 </div> <div class='card-face question'> <div class='question-content'> localhost </div> </div> <div class='card-face answer'> <div class='answer-content'> * Refers to the local computer that a program is running on (ex. surfing the internet: your computer is this). * Does not need to be specified or defined using a single computer but does when running programs from multiple computers. * The local machine is defined as this, which gives it an IP address of “127.0.0.1” (considered a "loopback" address). * Non-local computers must be defined by their IP addresses. * This term is often used in Web scripting languages like PHP and ASP when defining what server the code should run from or where a database is located. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='237' id='card-480292087'> <div class='header'> 237 </div> <div class='card-face question'> <div class='question-content'> loopback address </div> </div> <div class='card-face answer'> <div class='answer-content'> * The information sent to this IP address is routed back to the local machine (localhost). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='238' id='card-480292089'> <div class='header'> 238 </div> <div class='card-face question'> <div class='question-content'> CGI </div> </div> <div class='card-face answer'> <div class='answer-content'> * Common Gateway Interface is a set of rules for running scripts and programs on a web server. * It specifies what information is communicated between the web server and clients' Web browsers and how the information is transmitted. * A standard interface that can be used on multiple types of hardware platforms and is supported by several types of Web server software </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='239' id='card-480292090'> <div class='header'> 239 </div> <div class='card-face question'> <div class='question-content'> ISAPI </div> </div> <div class='card-face answer'> <div class='answer-content'> * An Internet Server Application Programming Interface is a set of ready-made Windows program calls that developers and programmers can use in order to create custom enhancements or extensions to HTTP servers or web servers compliant with this type of interface. * Makes it easier to write database applications like an entry system for order forms or for a custom catalog : a programmer can collect information from a user through an HTML form and then return a page which has been customized for that user. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='240' id='card-480292091'> <div class='header'> 240 </div> <div class='card-face question'> <div class='question-content'> Echo script </div> </div> <div class='card-face answer'> <div class='answer-content'> * In computing, a command that outputs the strings that are passed to it as arguments (A script executed in response to a request from your web browser) * Python script : could simply echo requests that often send data as key=value pairs, returning the pairs in the form of an HTML table </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='241' id='card-480292110'> <div class='header'> 241 </div> <div class='card-face question'> <div class='question-content'> Test Server </div> </div> <div class='card-face answer'> <div class='answer-content'> * Data sent to server: append a “query string” (begins with a “?”) to the Python script URL. * Multiple “query string” key=value pairs are separated by an “&” * Data can be sent: enter URL with query string directly into the address bar; hyperlink targeting the URL and query string; or JavaScript that sets location to the URL and query string </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='242' id='card-480292111'> <div class='header'> 242 </div> <div class='card-face question'> <div class='question-content'> Web page forms </div> </div> <div class='card-face answer'> <div class='answer-content'> * Built from HTML elements that send data to a web server for processing by a specified server-side script * Each includes a name attribute and a value attribute processed as key=value pairs </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='243' id='card-480292108'> <div class='header'> 243 </div> <div class='card-face question'> <div class='question-content'> <form> </div> </div> <div class='card-face answer'> <div class='answer-content'> * All form component elements are enclosed between these tags. * Must include a method attribute to specify the submission method as GET or POST * Must include an action attribute to specify the URL of the processing script </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='244' id='card-480292113'> <div class='header'> 244 </div> <div class='card-face question'> <div class='question-content'> method </div> </div> <div class='card-face answer'> <div class='answer-content'> * Attribute that specifies which HTTP method is used to submit the form * Can be assigned values of “GET” or “POST” </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='245' id='card-480292112'> <div class='header'> 245 </div> <div class='card-face question'> <div class='question-content'> GET </div> </div> <div class='card-face answer'> <div class='answer-content'> * The preferred submission method of forms: appends the data to the URL * Data sent by this method is attached to the request as a query string, so may be visible in the browser's address field in the web server’s response. * They only allow the URL to append up to around 200 characters ( varies by browser) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='246' id='card-480292114'> <div class='header'> 246 </div> <div class='card-face question'> <div class='question-content'> POST </div> </div> <div class='card-face answer'> <div class='answer-content'> * Submission method of forms that encodes the data differently from the GET method. * Can be used when the GET method fails. * You can submit by the POST method to prevent sensitive data from being visible in the browser’s address field with the web server’s response. * Provides a much larger capacity than the GET method as the text is sent as “Form Data” along with the HTTP header, not simply appended to the URL. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='247' id='card-480292115'> <div class='header'> 247 </div> <div class='card-face question'> <div class='question-content'> action </div> </div> <div class='card-face answer'> <div class='answer-content'> * Attribute specifying where to send the form-data when a form is submitted. * Specifies the URL of a server-side script that is to be used to process the submitted data. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='248' id='card-480292119'> <div class='header'> 248 </div> <div class='card-face question'> <div class='question-content'> Submit button </div> </div> <div class='card-face answer'> <div class='answer-content'> * Typically an HTML form will have this that the user clicks to send the data processing. * Typically created by assigning the value “submit” to a type attribute of an input tag. * This tag may include name and value attributes to submit data assigned to them as a name=value pair * Also created by assigning an id attribute to a form tag with a value identical to a button tag’s form attribute value (button tag must have type attribute with “submit” value). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='249' id='card-480292116'> <div class='header'> 249 </div> <div class='card-face question'> <div class='question-content'> Text boxes for input data </div> </div> <div class='card-face answer'> <div class='answer-content'> * An HTML form can provide these. * Created by assigning the value “text” to the type attribute of an input tag and a name to its name attribute * The input data and text box are sent as a key=value pair. * The input tag can include a value attribute to specify a default value </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='250' id='card-480292117'> <div class='header'> 250 </div> <div class='card-face question'> <div class='question-content'> “password” </div> </div> <div class='card-face answer'> <div class='answer-content'> * A text box for a password is created by assigning this value to the type attribute of an input tag * It does not display is contents as readable text </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='251' id='card-480292123'> <div class='header'> 251 </div> <div class='card-face question'> <div class='question-content'> <input> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Represents a typed data field usually associated with a control that allows users to edit its value. * This element is capable of providing many different types of fields, according to the value present in the type attribute. * Can also control what the user is permitted to submit by the value assigned to its type attribute. * Can enforce its completion by including the required keyword. * Can include name and value attributes to specify data for submission as a key=value pair. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='252' id='card-480292122'> <div class='header'> 252 </div> <div class='card-face question'> <div class='question-content'> Input types </div> </div> <div class='card-face answer'> <div class='answer-content'> * text * password * url * email * date * month * week * time * datetime-local * number * range * color * file </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='253' id='card-480292126'> <div class='header'> 253 </div> <div class='card-face question'> <div class='question-content'> text (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * String of text * You can specify a default value for this input to the “value” attribute of its input tag. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='254' id='card-480292127'> <div class='header'> 254 </div> <div class='card-face question'> <div class='question-content'> password (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * String of text ( obscured by browser) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='255' id='card-480292129'> <div class='header'> 255 </div> <div class='card-face question'> <div class='question-content'> url (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Valid URL protocol and domain address </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='256' id='card-480292130'> <div class='header'> 256 </div> <div class='card-face question'> <div class='question-content'> email (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Valid email address </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='257' id='card-480292131'> <div class='header'> 257 </div> <div class='card-face question'> <div class='question-content'> date (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Date in mm/dd/yyyy format </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='258' id='card-480292132'> <div class='header'> 258 </div> <div class='card-face question'> <div class='question-content'> month (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Month and year </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='259' id='card-480292133'> <div class='header'> 259 </div> <div class='card-face question'> <div class='question-content'> week (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Week number and year </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='260' id='card-480292135'> <div class='header'> 260 </div> <div class='card-face question'> <div class='question-content'> time (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> Time in HH:MM format </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='261' id='card-480292134'> <div class='header'> 261 </div> <div class='card-face question'> <div class='question-content'> datetime-local (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Day and time as mm-dd-yy HH:MM </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='262' id='card-480292136'> <div class='header'> 262 </div> <div class='card-face question'> <div class='question-content'> number (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Numeric integer value </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='263' id='card-480292166'> <div class='header'> 263 </div> <div class='card-face question'> <div class='question-content'> range (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Numeric integer value (slider) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='264' id='card-480292168'> <div class='header'> 264 </div> <div class='card-face question'> <div class='question-content'> color (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> * Color in #RRGGBB hexadecimal format </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='265' id='card-480292167'> <div class='header'> 265 </div> <div class='card-face question'> <div class='question-content'> file (input type) </div> </div> <div class='card-face answer'> <div class='answer-content'> File path address (browse) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='266' id='card-480292172'> <div class='header'> 266 </div> <div class='card-face question'> <div class='question-content'> Optional input attributes for text or password </div> </div> <div class='card-face answer'> <div class='answer-content'> * size - the width of the text box in average character widths * minlength and maxlength - permissible number of characters * min and max - permissible range of numeric value * placeholder - provides a data entry hint to the user * readonly - the default value in the text box cannot be changed * disabled - the text box is grayed out and will not be submitted </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='267' id='card-480292173'> <div class='header'> 267 </div> <div class='card-face question'> <div class='question-content'> <textarea> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines a multi-line text input control, and is often used in a form, to collect user inputs like comments or reviews. * Can hold an unlimited number of characters, and renders in a fixed-width font (usually Courier). * The size is specified by the <cols> and <rows> attributes (or with CSS). * The name attribute is needed to reference the form data after the form is submitted (if you omit the name attribute, no data from the element will be submitted). * The id attribute is needed to associate the element with a label. * May include a read-only attribute to prevent user editing * **Unlike the input tag, this element has no value attribute as its content is treated as its value. * **Average character which may vary between browsers, so the physical size of the element’s field may vary as well. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='268' id='card-480292170'> <div class='header'> 268 </div> <div class='card-face question'> <div class='question-content'> “checkbox” </div> </div> <div class='card-face answer'> <div class='answer-content'> * Assign to type attribute of <input>. * Must also include a name attribute and a value attribute: specifies the key=value pair values. * Option: may include a Boolean checked attribute. * May be individually unique or several can bear the same name with different values allowing several to be checked simultaneously. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='269' id='card-480292169'> <div class='header'> 269 </div> <div class='card-face question'> <div class='question-content'> “radio” </div> </div> <div class='card-face answer'> <div class='answer-content'> * Unlike checkboxes, these buttons that share a common name are mutually exclusive : when one is selected all others are automatically switched off. * Similar to checkboxes: created by assigning the value of radio to the type attribute of an input tag. * Multiple checkboxes and these buttons can be visually grouped by surrounding their input elements with <fieldset> tags and May bear a common group name through the use of <legend> tags. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='270' id='card-480292174'> <div class='header'> 270 </div> <div class='card-face question'> <div class='question-content'> <fieldset> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Only groups the related elements it encloses for visual presentation. * It does not associate them programmatically. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='271' id='card-480292175'> <div class='header'> 271 </div> <div class='card-face question'> <div class='question-content'> <legend> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Defines a caption for the <fieldset> element. * Used to state a common group name. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='272' id='card-480292171'> <div class='header'> 272 </div> <div class='card-face question'> <div class='question-content'> Hidden form data </div> </div> <div class='card-face answer'> <div class='answer-content'> * Hidden elements; create no visible controls; allow additional data to be submitted to the server. * Created by assigning the value hidden to the type attribute of an input tag * Must also include a name attribute; * May include a value attribute to specify static data as a name=value pair. * Option: the input tag may include an ID attribute and omit the value attribute so its value can be specified by script. * Hidden form data can be used to perform a calculation and dynamically displays result in an output tag. * * (Hidden data element can be useful as intra-website Cookies) </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='273' id='card-480299840'> <div class='header'> 273 </div> <div class='card-face question'> <div class='question-content'> <output> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Must include an ID attribute and a for attribute for reference in script. * Merely displays the result of the calculation. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='274' id='card-480299844'> <div class='header'> 274 </div> <div class='card-face question'> <div class='question-content'> for </div> </div> <div class='card-face answer'> <div class='answer-content'> * Can specify multiple element identities as a space separated list. * Can be used in an assignment to the form tags oninput attribute to perform a calculation whose result will appear in the output element but will not be submitted to the server. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='275' id='card-480300346'> <div class='header'> 275 </div> <div class='card-face question'> <div class='question-content'> File selection facility </div> </div> <div class='card-face answer'> <div class='answer-content'> * Calls upon the operating system’s “choose file” dialog allowing the user to browse and select a file. * Created: assign the value “ file” to the type attribute of an input tag and a name to its name attribute. * Produces: a text field and a browse button to launch the “choose file” dialog (full path appears after file is chosen). * Upon submission, element name and selected file’s name are sent to the web server as a name=value pair. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='276' id='card-480300351'> <div class='header'> 276 </div> <div class='card-face question'> <div class='question-content'> Uploading selected file to webserver </div> </div> <div class='card-face answer'> <div class='answer-content'> * Form tag with enctype attribute is required. * Enctype attribute should specify encoding type as “multipart/form-data”. * Method attribute must specify the POST method (form data cannot be appended to a URL using the GET method). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='277' id='card-480300366'> <div class='header'> 277 </div> <div class='card-face question'> <div class='question-content'> enctype </div> </div> <div class='card-face answer'> <div class='answer-content'> * The encoding type attribute is used only with a <form> element. * Specifies how the form-data should be encoded when submitting it to the server. * When uploading selected file to web server, specify this attribute as “multipart/form-data.” </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='278' id='card-480300367'> <div class='header'> 278 </div> <div class='card-face question'> <div class='question-content'> Push buttons </div> </div> <div class='card-face answer'> <div class='answer-content'> * For scripting purposes: allows dynamic interaction with a form. * Can be used to set attribute values * Created: specifying “button” value to the type attribute of an input tag; should include an ID attribute to easily identify that element; text assigned to the button’s value attribute will appear on the button face. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='279' id='card-480300368'> <div class='header'> 279 </div> <div class='card-face question'> <div class='question-content'> checked </div> </div> <div class='card-face answer'> <div class='answer-content'> * Sets the initial state of a checkbox or radio button to checked. * This attribute need have no assigned value: its presence equals on; its absence equals off. * In script, the box’s checked property needs to be assigned a “true” value to check the box. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='280' id='card-480300369'> <div class='header'> 280 </div> <div class='card-face question'> <div class='question-content'> Reset button </div> </div> <div class='card-face answer'> <div class='answer-content'> * Returns any HTML form to its original state: all form data values are set to their initial default values. * Created: specifying a “reset” value to the type attribute of an input tag nested in a <form> tag. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='281' id='card-480300370'> <div class='header'> 281 </div> <div class='card-face question'> <div class='question-content'> Image buttons </div> </div> <div class='card-face answer'> <div class='answer-content'> * Used to submit a form in place of a regular submit button. * Created : specifying an “image” value to the type attribute of an input tag; including an alt attribute. * When a form is submitted by this, the XY coordinates of the point at which the click occurred are automatically submitted as key=value pairs along with the rest of the form data. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='282' id='card-480300371'> <div class='header'> 282 </div> <div class='card-face question'> <div class='question-content'> Script-enabled image button </div> </div> <div class='card-face answer'> <div class='answer-content'> * A regular img tag can be used as this by attaching a behavior with script. * With this, validation can usually be incorporated (an image used in this way is given an identity so as to attach the behavior). * Validation example: checking an entry to see if it follows the set pattern of an email address. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='283' id='card-480300372'> <div class='header'> 283 </div> <div class='card-face question'> <div class='question-content'> Select option list </div> </div> <div class='card-face answer'> <div class='answer-content'> * From this, the user can select one option to include its associated data for submission to the server. * Will normally appear as a single-line drop-down list unless a “size” attribute is included in the select tag specifying the number of rows to be visible. * Created: using select tags; must include a name attribute specifying a list name; the select element encloses option tags defining each option; each option tag must include a value attribute specifying an option value. * When the form is submitted, the list name and the selected option value are sent as a name=value pair. * Optionally, The option tag may include a Boolean “selected” attribute to automatically select that option (including this provides a default choice). </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='284' id='card-480300373'> <div class='header'> 284 </div> <div class='card-face question'> <div class='question-content'> Logo push buttons </div> </div> <div class='card-face answer'> <div class='answer-content'> * Created: using button tags; enclosing an img element specifying the URL of a logo image; specifying text that would appear on the button face; should include a type attribute to specify a scripting “button” type, a “submit” form type; OR a “reset” form type. * Scripting buttons can use an “onclick” attribute to specify the button’s function, or directly specify a snippet of script to execute. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='285' id='card-480300375'> <div class='header'> 285 </div> <div class='card-face question'> <div class='question-content'> <datalist> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Provides a simple autocomplete feature for a text input element enclosing a number of predefined <option> values. * User may choose any one of the options, or enter text directly into the input field (you may need to double-click the input field to override your browser's own autocomplete suggestions). * Created: must include an ID attribute (specifying a list name) to associate the input field with the list; the specified ID list name must then be specified to a “list” attribute to send the input tag to create the association; the input tag must also include a name attribute to send to the server. * The key=value pair submitted to the server is the specified list name and the input value selected from the options or entered directly by the user. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='286' id='card-480300377'> <div class='header'> 286 </div> <div class='card-face question'> <div class='question-content'> <optgroup> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Element used to group related options in a <select> element. * With a long list of options, this makes handling easier for user. * Option-group name specified to a “label” attribute. * The attribute disabled specifies that an option-group should be disabled. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='287' id='card-480300403'> <div class='header'> 287 </div> <div class='card-face question'> <div class='question-content'> <label> </div> </div> <div class='card-face answer'> <div class='answer-content'> * Can enclose text that is to be associated with a form control (a form control is any input, button, or textarea element). * Alternatively, can simply enclose both the text and the control element to make the association (this allows styling to be applied to the entire label: often useful to distinguish the control associated with a particular text). * Can include a “for” attribute specifying the value assigned to the control’s ID attribute to make the association. </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='288' id='card-480300408'> <div class='header'> 288 </div> <div class='card-face question'> <div class='question-content'> Form control elements </div> </div> <div class='card-face answer'> <div class='answer-content'> * <input> * <button> * <textarea> </div> </div> </div> <div class='flashcard-row thin-card is-blurrable' data-a-button-url='/sign-up?packId=19390799&returnTo=%2Fpacks%2F19390799%2Fsubscribe&source=preview-card&subject=World+Wide+Pond+Devlpmnt%2FDesign' data-card-is-blurrable data-number='289' id='card-480309340'> <div class='header'> 289 </div> <div class='card-face question'> <div class='question-content'> tabindex </div> </div> <div class='card-face answer'> <div class='answer-content'> * Each form control element may include this attribute to specify its tabbing order within the doc as a unique value between 0 and 32,767. * Using the Tab Key, the user can navigate the doc ascending through the tabindex values. * This attribute can also be included in any <a>, <area>, <object>, or <select> tag. </div> </div> </div> </div> </div> </div> <div class='flashcards-sidebar'> <div class='sidebar-header'> <div class='react-component' id='flashcards-search-bar'> <div class='placeholder market-search-bar' id='flashcards-search-bar-placeholder'></div> </div> </div> <div class='sidebar-content'> <p class='deck-subject-heading'> <a class="decks-in-subject-link" href="/packs/world-wide-pond-devlpmnt-design-19390799"><span class="pack-name">World Wide Pond Devlpmnt/Design</span> (53 decks) </a></p> <ul class='deck-list-items'> <a class='deck-link selected' href='/flashcards/ies-html-10874976/packs/19390799'> <li class='deck-list-item'>IES: HTML</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk1-14962811/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk1</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk2-14981080/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk2</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk3-14981281/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk3</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk4-14981283/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk4</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk6-14981289/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk6</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk5-14981288/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk5</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk7-14981290/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk7</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk8-14981293/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk8</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk9-14981294/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk9</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk10-14981297/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk10</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk11-14981299/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk11</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk12-14981300/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk12</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk13-14981301/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk13</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk14-14981305/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk14</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk15-14981309/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk15</li> </a> <a class='deck-link ' href='/flashcards/ies-html-recog-dk16-14981311/packs/19390799'> <li class='deck-list-item'>IES: HTML-recog dk16</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-1-16298131/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 1</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-2-16298435/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 2</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-3-16308363/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 3</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-4-16324960/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 4</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-5-16658461/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 5</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-6-16692233/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 6</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-7-16717500/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 7</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-8-16730821/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 8</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-9-16748133/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 9</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-10-16750832/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 10</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-11-16821364/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 11</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-12-16821901/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 12</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-13-16823598/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 13</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-14-16892098/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 14</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-15-16900958/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 15</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-16-16954162/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 16</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-17-16967070/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 17</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-18-17027805/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 18</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-19-17040531/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 19</li> </a> <a class='deck-link ' href='/flashcards/ies-css-deck-20-17063282/packs/19390799'> <li class='deck-list-item'>IES: CSS-deck 20</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-1-17064524/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 1</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-2-17159132/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 2</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-3-17160750/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 3</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-4-17161039/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 4</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-5-17161079/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 5</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-6-17161245/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 6</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-7-17161333/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 7</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-8-17161363/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 8</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-9-17161387/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 9</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-10-17161401/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 10</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-11-17161440/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 11</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-12-17864021/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 12</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-13-18138160/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 13</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-14-18170540/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 14</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-15-18170541/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 15</li> </a> <a class='deck-link ' href='/flashcards/ies-js-deck-16-18170577/packs/19390799'> <li class='deck-list-item'>IES: JS-deck 16</li> </a> </ul> </div> </div> </div> <div id='tooltip-controller'></div> <div data='{"packId":19390799,"source":"spaced-repetition-modal","subject":"World Wide Pond Devlpmnt/Design","resources":{"deckId":10874976,"packId":19390799},"returnTo":"/packs/19390799/subscribe"}' id='spaced-repetition-modal-controller'></div> <div id='banner-controller'></div> <div id='dialog-modal-controller'></div> <div class='band band-footer'> <div class='footer-main'> <ul class='sections'> <li class='section key-links'> <p class='section-heading'> Key Links </p> <ul class='options-list'> <li class='option'> <a id="footer-pricing-link" class="option-link" href="/pricing?paywall=upgrade">Pricing</a> </li> <li class='option'> <a class="option-link" href="/companies">Corporate Training</a> </li> <li class='option'> <a class="option-link" href="/teachers">Teachers & Schools</a> </li> <li class='option'> <a class="option-link" target="_blank" rel="nofollow noopener noreferrer" href="https://itunes.apple.com/us/app/brainscape-smart-flashcards/id442415567?mt=8">iOS App</a> </li> <li class='option'> <a class="option-link" target="_blank" rel="nofollow noopener noreferrer" href="https://play.google.com/store/apps/details?id=com.brainscape.mobile.portal">Android App</a> </li> <li class='option'> <a class="option-link" target="_blank" rel="noopener" href="https://www.brainscape.com/faq">Help Center</a> </li> </ul> </li> <li class='section subjects'> <p class='section-heading'> Subjects </p> <ul class='options-list'> <li class='option'> <a class="option-link" href="/subjects/medical-nursing">Medical & Nursing</a> </li> <li class='option'> <a class="option-link" href="/subjects/law">Law Education</a> </li> <li class='option'> <a class="option-link" href="/subjects/foreign-languages">Foreign Languages</a> </li> <li class='option'> <a class="option-link" href="/subjects-directory/a">All Subjects A-Z</a> </li> <li class='option certified-classes'> <a class="option-link" href="/learn">All Certified Classes</a> </li> </ul> </li> <li class='section company'> <p class='section-heading'> Company </p> <ul class='options-list'> <li class='option'> <a class="option-link" href="/about">About Us</a> </li> <li class='option'> <a target="_blank" class="option-link" rel="nofollow noopener noreferrer" href="https://brainscape.zendesk.com/hc/en-us/articles/115002370011-Can-I-earn-money-from-my-flashcards-">Earn Money!</a> </li> <li class='option'> <a target="_blank" class="option-link" href="https://www.brainscape.com/academy">Academy</a> </li> <li class='option'> <a target="_blank" class="option-link" href="https://brainscapeshop.myspreadshop.com/all">Swag Shop</a> </li> <li class='option'> <a target="_blank" rel="nofollow noopener" class="option-link" href="/contact">Contact</a> </li> <li class='option'> <a target="_blank" rel="nofollow noopener" class="option-link" href="/terms">Terms</a> </li> <li class='option'> <a target="_blank" class="option-link" href="https://www.brainscape.com/academy/brainscape-podcasts/">Podcasts</a> </li> <li class='option'> <a target="_blank" class="option-link" href="/careers">Careers</a> </li> </ul> </li> <li class='section find-us'> <p class='section-heading'> Find Us </p> <ul class='social-media-list'> <li class='option twitter-badge group'> <a rel="nofollow noopener noreferrer" target="_blank" class="option-link" href="https://twitter.com/Brainscape"><img data-src="/pks/images/shared/twitterx-af917e8b474ed7c95a19.svg" alt="twitter badge" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="24" height="24" /></a> </li> <li class='option linkedin-badge group'> <a rel="nofollow noopener noreferrer" target="_blank" class="option-link" href="https://www.linkedin.com/company/brainscape/"><img data-src="/pks/images/shared/linkedin-2f15819658f768056cef.svg" alt="linkedin badge" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="24" height="24" /></a> </li> <li class='option facebook-badge group'> <a rel="nofollow noopener noreferrer" target="_blank" class="option-link" href="https://www.facebook.com/Brainscape"><img data-src="/pks/images/shared/facebook-1598a44227eabc411188.svg" alt="facebook badge" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="24" height="24" /></a> </li> <li class='option youtube-badge group'> <a rel="nofollow noopener noreferrer" target="_blank" class="option-link" href="https://www.youtube.com/c/BrainscapeNY"><img data-src="/pks/images/shared/youtube-7f2994b2dc1891582524.svg" alt="youtube badge" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="24" height="24" /></a> </li> <li class='option pinterest-badge group'> <a rel="nofollow noopener noreferrer" target="_blank" class="option-link" href="https://www.pinterest.com/brainscape/"><img data-src="/pks/images/shared/pinterest-04f51aa292161075437b.svg" alt="pinterest badge" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="24" height="24" /></a> </li> <li class='option tiktok-badge group'> <a rel="nofollow noopener noreferrer" target="_blank" class="option-link" href="https://www.tiktok.com/@brainscapeu"><img data-src="/pks/images/shared/tiktok-644cf4608bd73fbbb24f.svg" alt="tiktok badge" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="24" height="24" /></a> </li> <li class='option insta-badge group'> <a rel="nofollow noopener noreferrer" target="_blank" class="option-link" href="https://www.instagram.com/brainscape/"><img data-src="/pks/images/shared/insta-210cc2d059ae807961d2.svg" alt="insta badge" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="24" height="24" /></a> </li> </ul> <div class='get-the-app'> <div class='qr-code'> <img data-src="https://www.brainscape.com/assets/cms/public-views/shared/shortio-from-homepage.png" alt="QR code" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="130" height="130" /> </div> <div class='app-badges'> <div class='badge apple-badge'> <a rel="nofollow noopener noreferrer" target="_blank" class="option-link" href="https://apps.apple.com/us/app/brainscape-smart-flashcards/id442415567"><img data-src="/pks/images/shared/apple-badge-b6e4f380fb879821d601.svg" alt="apple badge" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="124" height="50" /></a> </div> <div class='badge android-badge'> <a rel="nofollow noopener noreferrer" target="_blank" class="option-link" href="https://play.google.com/store/apps/details?id=com.brainscape.mobile.portal&utm_source=global_co&utm_medium=prtnr&utm_content=Mar2515&utm_campaign=PartBadge&pcampaignid=MKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1"><img data-src="/pks/images/shared/android-badge-a2251833dc7f6ca8879c.svg" alt="android badge" class="lazy-load" src="/pks/images/shared/placeholder-2f8e0834f3c4456dc1cc.jpg" width="124" height="50" /></a> </div> </div> </div> </li> </ul> </div> <div class='footer-blurb'> Brainscape helps you reach your goals faster, through stronger study habits. <br> © 2025 Bold Learning Solutions. <a class="option-link" href="/terms">Terms and Conditions</a> </div> </div> <script> if (typeof window.__REACT_DEVTOOLS_GLOBAL_HOOK__ === 'object') { __REACT_DEVTOOLS_GLOBAL_HOOK__.inject = function() {}; } </script> <script> window.addEventListener('load', () => { setTimeout(() => { const script = document.createElement('script'); script.src = "/pks/js/public-deck-cards-page-d0410d84e8b38e8511bf.js"; script.defer = true; document.body.appendChild(script); }, 0); }); </script> <script src="https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js" defer="defer"></script> <script> document.addEventListener("mainSharedready", () => { GaHelper.setGaDimension("dimension1","No"); }); </script> <script type='application/ld+json'> {"@context":"https://schema.org/","@type":"Quiz","about":{"@type":"Thing","name":"IES: HTML"},"hasPart":[{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Block element Paragraph container separates content into sentences and paragraphs to be more easily read and more readily understood The browser usually separates each paragraph element typically leaving two empty lines between them."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Article container element contains a stand-alone composition"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The anchor is an Inline element that defines a hyperlink which allows users to navigate from one page to another. The href attribute is most important to this element indicating the link's destination: Without href, there is no hyperlink. The anchor can also include a title attribute displaying a “tooltip” when the hyperlink is hovered over."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"URL","acceptedAnswer":{"@type":"Answer","text":" A web address is formally known as a uniform resource locator Has three parts: protocol, domain, and its path"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"HTML","acceptedAnswer":{"@type":"Answer","text":" hypertext markup language"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"HTTP","acceptedAnswer":{"@type":"Answer","text":" Hypertext transfer protocol This is the first of the three parts that make up the URL: the protocol Always appears as the URL prefix: http://"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"HTTPS","acceptedAnswer":{"@type":"Answer","text":" Hypertext transfer protocol secure Always appears as the URL prefix : https://"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Protocol","acceptedAnswer":{"@type":"Answer","text":" A set of rules governing the exchange or transmission of data between devices Denoted by the prefix on any URL (example http://… or https://…) 1st of 3 parts of the URL"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"IP","acceptedAnswer":{"@type":"Answer","text":" Internet Protocol The numerical address of a specific domain name"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"WHATWG","acceptedAnswer":{"@type":"Answer","text":" Web hypertext application technology working group An organization or group that sustains or supports the standard of the HTML language established by the W3C to prevent that Global Internet language from being fragmented or compromised This agency maintains the ever-evolving HTML living standard as technology in the world wide web culture demands"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"W3C","acceptedAnswer":{"@type":"Answer","text":" Short for World Wide Web Consortium It is the international governing body for the development of platform-independent web standards and specifications"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Domain Or domain name","acceptedAnswer":{"@type":"Answer","text":" The hostname of the computer from which the file can be downloaded. For instance: www.example.com The second of three parts of a URL"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Path","acceptedAnswer":{"@type":"Answer","text":" The file name prefixed by any Parent Directory names where applicable. For instance:/htdocs/index HTML The third of three parts that form a URL"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"DNS","acceptedAnswer":{"@type":"Answer","text":" The domain name system (DNS) Is the phone book of the internet. Humans access information online through domain names, like nytimes.com or espn.com DNS servers translate domain names into IP addresses, so browsers can load Internet resources."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Webserver","acceptedAnswer":{"@type":"Answer","text":" The World Wide Web is comprised of a series of large-capacity computers known as web servers. Upon request from a computer for a resource, a web server will send back response headers and a copy of the requested file or an error message."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"HTML document skeletal structure","acceptedAnswer":{"@type":"Answer","text":"The skeletal structure has three parts: document type declaration Head section Body section"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Document type declaration","acceptedAnswer":{"@type":"Answer","text":" Declaring precisely which version of HTML is used to mark up the document."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" provides descriptive data about the document itself, such as the document title and the character set used. Non-empty element"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Contains the content that is to appear when the document gets loaded into a web browser Non-empty element"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"HTML fundamental structure (basic coding structure)","acceptedAnswer":{"@type":"Answer","text":" "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"lang","acceptedAnswer":{"@type":"Answer","text":" attribute of the HTML root element (the previous “lang” attribute code appoints the document’s language as English) (“ar”: Arabic, “fr”: French, “es”: Spanish) attribute of the HTML root element (the previous “lang” attribute code appoints the document’s language as English) (“ar”: Arabic, “fr”: French, “es”: Spanish)"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":"- empty element - presents Information or parameters about the document itself - always appears in the head of the document's HTML coding"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Charset","acceptedAnswer":{"@type":"Answer","text":" Character-set Charset is an attribute of the meta element Example coding: ( )"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"UTF-8","acceptedAnswer":{"@type":"Answer","text":" Setting the Charset as utf-8 assigns an 8-bit Unicode Transformation Format For the HTML document A type of character encoding format"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Text container in the head where the doc’s title is placed very important for SEO. Used extensively: bookmarks Title bar Navigation tab History Search engines Title should be short and meaningful: ideal length- 10 characters or less."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"SEO","acceptedAnswer":{"@type":"Answer","text":" Search Engine Optimization. Highly prized process of improving a page's organic page rankings (rank in search results) presumably, maximizing the number of visitors to a particular website. It is useful to provide sufficient metadata that describes the page content well."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Block element The tags For this element contain the largest of 6 different sizes of headings and subheadings Usually holds the doc’s main heading (Should be only one in doc, but can be more)"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"W3C Validator Tool","acceptedAnswer":{"@type":"Answer","text":" Validator.w3.org Validator tools verify that any HTML doc will conform to its specified document type declaration: thereby, always appearing correctly in any standards-compliant browser."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"HTML “character entities”","acceptedAnswer":{"@type":"Answer","text":" In HTML coding, the way of including special characters in the document Begins with an ampersand and ends with a semicolon (\u0026 … ;) (W3C Chart of all character entities at: dev.w3.org/html5/html-author/charref) Best avoided in doc titles as the vocal narrator used by visually impaired viewers may read entity as a word."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":" (The only coding relevant to this question lies between the quotes.)","acceptedAnswer":{"@type":"Answer","text":" (\u003c) These are often needed to avoid confusion with the angled brackets that surround each HTML tag."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":" (The only coding relevant to this question lies between the quotes.)","acceptedAnswer":{"@type":"Answer","text":" (\u003e) These are often needed to avoid confusion with the angled brackets that surround each HTML tag."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Word of coding: begins with \" \u0026...\" followed by \"..nbsp..\" ending in \"..; \" (The only coding relevant to this question lies between the quotes.)","acceptedAnswer":{"@type":"Answer","text":" (a single non-breaking space) A commonly used HTML entity A space that will not break into a new line. Two words separated by a non-breaking space will stick together (not break into a new line). This is handy when breaking the words might be disruptive."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":" (The only coding relevant to this question lies between the quotes.)","acceptedAnswer":{"@type":"Answer","text":" (bullet point)"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":" (The only coding relevant to this question lies between the quotes.)","acceptedAnswer":{"@type":"Answer","text":" (©)"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":" (The only coding relevant to this question lies between the quotes.)","acceptedAnswer":{"@type":"Answer","text":" (™)"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":" (The only coding relevant to this question lies between the quotes.)","acceptedAnswer":{"@type":"Answer","text":" (®)"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":" (The only coding relevant to this question lies between the quotes.)","acceptedAnswer":{"@type":"Answer","text":" ( “ ), (Quotation marks) Example: \"HTML in easy steps\" (Appears as HTML in easy steps)"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"To launch the narrator in Windows 10","acceptedAnswer":{"@type":"Answer","text":" WinKey + Ctrl + Enter Press the “tab” button to hear the document title"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Coding in HTML to place a comment that is ignored by the browser","acceptedAnswer":{"@type":"Answer","text":" "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Optimize doc view (all screens)","acceptedAnswer":{"@type":"Answer","text":" Optimizes the page view for smaller / larger screens: ensures doc will fill the device screen width Sets the initial zoom level so the content is not zoomed. Coding: "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Auto-page reload","acceptedAnswer":{"@type":"Answer","text":" A technique often used in websites to dynamically update news our status items Does not depend on JavaScript support Coding: "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Auto page redirection","acceptedAnswer":{"@type":"Answer","text":" Coding: "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"SERP","acceptedAnswer":{"@type":"Answer","text":" search engine result page Will Show The Meta description in search results below the page title"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Meta “description”","acceptedAnswer":{"@type":"Answer","text":" Should be between 50 and 160 characters long Including keywords relative to the text content is important for SEO purposes Coding: "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Canonical link","acceptedAnswer":{"@type":"Answer","text":" If a website contains pages of identical or very similar content you can specify which page is to be indexed by including this. - designates the original source for a piece of content Coding: "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Empty element Used to incorporate resources in a document ONLY appears in the head of the document (may contain many links) Must contain “rel” and “href” attributes May contain title or type attributes"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"type","acceptedAnswer":{"@type":"Answer","text":" Hints at the MIME type of the link resource. For elements, attribute specifies the type of button. For elements, attribute specifies the type of element to display. For , , , , \u003csource\u003e, and \u003cstyle\u003e elements attribute specifies the Internet media type (formerly known as MIME type). May intend to help search engines to locate resources associated with the HTML document."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"title","acceptedAnswer":{"@type":"Answer","text":" Specifies extra information about an element or resource. The information is most often shown as a tooltip text when the mouse moves over the element. The title attribute is part of the Global Attributes, and can be used on any HTML element. May include a title for the page in another language"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"CSS","acceptedAnswer":{"@type":"Answer","text":" Cascading Style Sheets contain hierarchical information about how the content of a web page will be rendered in a browser or the presentational aspects of the content. When multiple rules select the same property, the order of precedence: 1st) Generally, the rule read last by browser; 2nd) In-line rules (style as attribute); 3rd) embedded rules ( tags in head); 4th) external rules (\u003clink\u003e tag (in head) to stylesheet);"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"rel","acceptedAnswer":{"@type":"Answer","text":" Attribute : “relationship” Example : "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"href","acceptedAnswer":{"@type":"Answer","text":" The Hypertext reference is an attribute of the anchor tag, which is used to identify sections within a document (i.e. internal links) used to identify links to pages in other sites (i.e. external links) The HREF contains two components: the URL, which is the actual link, and the clickable text that appears on the page, called the \"anchor text.\" Example: A (in-document hypertext navigational link anchor) Example: "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Added within or linked to an HTML document To present the rules governing how the content will appear Rules governing the content appearance are linked to the html doc through: Can be embedded within the head section Employed as an attribute in-line Linked by use of an external document to single or multiple HTML documents"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Block element; semantically meaningless; anonymous. (Best avoided in favor of more meaningful tags) Not to be used for structural purposes: should be used for stylistic purposes. Can include an id, class, or style attribute for application of style rules."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" In-line element; semantically meaningless; anonymous (Best avoided in favor of more meaningful tags) Not to be used for structural purposes: it should rather be used for stylistic purposes. Can include an id, class, or style attribute for application of style rules."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Best placed right before the body closing tag (), so browser Can process doc content before reading script Embeds JavaScript within an HTML document; links doc to a separate file: … ; or JS can be specified by script in-line to on-event (Ex: a mouse click event - "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Only displayed when JavaScript functionality is absent or disabled Text container for Alternative fallback content (Example- JavaScript Is Not Enabled! )"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Exists purely for scripting"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Exists purely for scripting"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"MIME","acceptedAnswer":{"@type":"Answer","text":" Multipart Internet Mail Extension Standard for formatting files of different types, such as text, graphics, or audio, so they can be sent over the internet and seen or played by a web browser or email application. Describes file types: ex.: “text/html” Official list at: http://www.iana.org/assignments/media-types/media-types.xhtml"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Empty element Specifies an alternate directory holding resources/files to be recognized by the browser. ( ) Must be placed in doc head before any elements."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Absolute address","acceptedAnswer":{"@type":"Answer","text":" Includes the entire URL: protocol, domain name, and path Example: “https://www.laurendaigle.com/Daigle-turquoise.jpg”"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Relative address","acceptedAnswer":{"@type":"Answer","text":" Can reference a file in home directory of the main HTML document by file name and may use the ../ syntax to reference that parent directory. (Example: /Daigle-turquoise.jpg) By default, the browser will look in HTML doc’s home directory."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Permitted “rel” values","acceptedAnswer":{"@type":"Answer","text":" (Many are intended to help search engines locate resources associated with that HTML document (a.k.a. Increase traffic to your webpage/website/document)) Alternate Author Bookmark Help Icon License Next Nofollow Noreferrer Prev Search Stylesheet Tag Shortcut icon"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Icon","acceptedAnswer":{"@type":"Answer","text":" Established in the head Force browser to refresh icon- assign “favicon.ico?v=2” to link’s href attribute Coding: "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Heading elements","acceptedAnswer":{"@type":"Answer","text":" Order of importance (, , , , , ) should implicitly convey the document structure through correct sequencing of the heading tags Correct sequencing and use of meta keywords in headings is important to SEO and allows syndication into another site Never use heading tags for their style qualities"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Grouping solution to the limited number of heading levels and the need to maintain a correctly sequenced document outline Doc may contain multiple hgroup elements, but an hgroup may contain ONLY heading elements. Ex. code HTML Building better websites "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" May contain heading; hgroup; intro items like icons, banners, and table of contents; etc You cannot Nest header elements one within another Ex. code HTML Building better websites "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Acts as a wrapper (not to replace any structural element) enclosing page-wide or site-wide navigation hyperlinks groups Includes ONLY page-wide or site-wide nav hyperlinks groups Ex. code Site Links Markup Scripting Style Sheets "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Empty element used to embed an image in an HTML page are not technically inserted into a web page: they are linked to web pages creates a holding space for the referenced image Ex. code "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Includes a list of commands for the webpage or website Groups of hyperlinks on a webpage navigating around the page or website should be enclosed in nav tags or menu tags"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Line break element Can force the text to wrap to The next line Before It would automatically wrap to the next line at the text container elements edge"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" A footer can be included in a doc or article, section, etc. of a doc and provides info about the doc or division of the.doc Might contain an address element (contact details, etc.); a small element (copyright, etc.); and a nav element Ex. code … Copyright © Example Corp. www.example.com "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Page content container located between the header and the footer Ex. code (Page content goes here.) "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Formats text (fine print items) within the body of the document, but is only meant to contain short comments that supplement surrounding content Regarded as a side comment to surrounding text such as copyright information Does not denote content of lesser importance"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Container for Author’s name, author’s contact info, etc. Often located in the footer element"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Contains a stand-alone composition Might typically begin with its own heading followed by one or more paragraphs"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"VPN","acceptedAnswer":{"@type":"Answer","text":" A virtual private network gives online privacy \u0026 anonymity by creating a private network from a public internet connection. extends a private network across a public network enables users to send and receive data across shared or public networks as if their computing devices were directly connected to the private network."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Typically a sidebar or footnote, it should contain stand alone info ( May contain a footer element, but not a nav hyperlink). Can be nested in an article element incorporating contents SOMEWHAT RELATED to the main content, or used alone containing secondary content RELATED to the entire page, such as advertising. Ex code Oscar Wilde (1854-1900) Was an Irish writer and poet. "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" A grouping Element Not required in short docs unless you want to add section headings and footers Content placed within a body element and nested within a main element can also then be nested in a section element"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Empty element A horizontal rule tag can be inserted between paragraphs drawing a line separating them, but it may not be inserted inside of paragraph to separate sentences It represents a “paragraph-level thematic break“ such as a scene change in a story It represents the equivalent of an ellipsis standing alone on its own line"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Flow","acceptedAnswer":{"@type":"Answer","text":" the arrangement of page elements as defined by positioning statements and the order of html statements how the different elements take up space and arrange themselves around each other."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"Phrasing","acceptedAnswer":{"@type":"Answer","text":" The use of HTML phrase tags are special purpose tags, which define the structural meaning of a block of text or semantics of text. Must always be enclosed by a flow element Ex. , "}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Changes font to bold should only be used as a last resort: One legitimate use is to mark up the lead sentence of an article No emphasis added or changed"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The quotes element causes the browser to automatically add quotation marks around the content phrasing element Quote elements can be nested one within another"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The emphasis element creates italics in the font and bears an emphasized semantic meaning in the content Used as an inline element for stylistic and semantic purposes with the font and content"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Intended to surround long quotations from another source and bears no quotation marks Typically produces a rectangular block area to contain the quotation starting on a new line and indented from surrounding content"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Changes Font to bold Emphasizes or increases Without changing the meaning of the sentence"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Changes font to italics (should only be used as a last resort) Text is enhanced without conveying extra importance such as technical terms"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The strikethrough is a phrasing element marking the text as being superseded by more accurate, relevant, up-to-date content Typically displayed with a strikethrough line Should not be used to indicate edited content"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The deleted-text element formats text with a strikethrough, and may include a cite attribute to specify a doc’s URL that will explain the changes Text within is regarded as having been removed from the document such as a completed item in a to-do list"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The inserted-text element formats text with an underline: may include a cite attribute to specify a docs URL explaining changes. Text within is regarded as having been added to the document such as a new additional items in a to-do list"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The word-break-opportunity is a phrasing element INVISIBLY marking the text broken by this tag as being a suitable point at which to break the line of text Particularly suitable for small devices for docs that may contain content that may exceed the width of browser"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The unarticulated annotation (underline) is a phrasing element marking the text as being different in some way to normal text content and is TYPICALLY underlined. Has the purpose of labeling misspelled words or labeling proper names in Chinese. Use is strongly discouraged due to confusion with hyperlinks."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" Flow/Block element that preserves the preformatting of the enclosed text: 1.) preserves white space; 2) renders all text with a fixed-width font; 3) disables automatic word-wrapping; 4) does not disable bi-directional processing Use spaces in the place of tabs when preparing pre-formatted text"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The marked-text is a phrasing element indicating the text as being of special significance for reference or notation. Typically displayed in a colored background block to highlight the text Not for emphasis: only to be used to highlight the relevance or importance of the text within a doc"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" The subscript element specifies inline text typically with a lowered baseline using smaller font displayed for solely typographical reasons. Numbers (0-9) = ₀ - ₉ Any content can be included within the tags, whereas, the availability of character entity references is limited."}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":" html coding : ₀","acceptedAnswer":{"@type":"Answer","text":" subscript \"0\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" subscript \"1\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" subscript \"2\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" subscript \"3\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" subscript \"4\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" subscript \"5\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" subscript \"6\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" subscript \"7\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" subscript \"8\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" subscript \"9\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":" ; ⊃","acceptedAnswer":{"@type":"Answer","text":" The superscript (element and entity) specifies inline text typically with a raised baseline using smaller font and displayed for solely typographical reasons. Numbers = 1= ¹ 2= ² 3= ³ 4=⁴ 5= ⁵ 6= ⁶ 7= ⁷ 8= ⁸ 9= ⁹ 0= ⁰ Any content can be included within the tags, whereas, the availability of character entity references is limited. 2 appears larger than “ ²” ; however, the entity as opposed to the tag keeps line spacings equal"}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" superscript \"1\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" superscript \"2\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" superscript \"3\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" superscript \"4\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" superscript \"5\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" superscript \"6\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" superscript \"7\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" superscript \"8\""}},{"@context":"https://schema.org/","@type":"Question","eduQuestionType":"Flashcard","text":"","acceptedAnswer":{"@type":"Answer","text":" superscript \"9\""}}],"educationalAlignment":[{"@type":"AlignmentObject","alignmentType":"educationalSubject","targetName":"IES: HTML"}]} </script> </body> </html>