IES: HTML dk8

Question 1

• An element connection 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 is sensitive to three interactive states: Hover, Active, and Visited.
• Distinguished by browsers with underlining or colored borders typically.

Answer 1

hyperlink

Question 2

• Attribute specifying keyboard shortcuts to activate/focus specific elements (It supports all HTML elements)
• With an anchor tag, attribute designates any, single keyboard character (the value of the attribute) as a shortcut for a particular hyperlink.
• Browser-dependent: utilize the shortcuts thus - “Alt+"attribute value"” for most browsers; “Alt+Shift+"attribute value"” for Firefox; “Cmd+"attribute value"” for Mac [and Apple?] users.
• Identify the keyboard “attribute value” in the content text by using the <u> or <i> tags.
• Efforts are being made to address accessibility conflict created by these.
• Example coding:
  <a href="index.html" \_\_\_\_\_\_\_="h">Home</a>
  To identify ‹H›:
  <a href="index.html" \_\_\_\_\_\_\_\_="h"><i>H</i>ome</a>

Answer 2

accesskey

Question 3

• 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.

Answer 3

3 ways to access hyperlinks

Question 4

• A short string of characters established to identify a resource that is subordinate to another, primary resource.
• In a separate doc, an 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 portion specified 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)

Answer 4

Fragment links

Question 5

• Defines an unordered list of items
• Typically rendered as a bulleted list.
• Use the <\_\_\_> tag together with the <li> tag to create unordered lists.

Answer 5

<ul>

Question 6

• 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)

Answer 6

href protocols

Question 7

• 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=”\_\_\_\_\_\_\_\_\_: square”> … </ul>

Answer 7

list-style-type property

Question 8

• The list item is used inside ordered lists <ol>, unordered lists <ul>, and in menu lists <menu>.
• Contains individual list items

Answer 8

<li>

Question 9

• style attribute specifies that this 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=”\_\_\_\_\_\_\_\_\_: ‘Daigle-turquoise-small.jpg’”> … </ul>

Answer 9

list-style-image property

Question 10

• In this, 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 these 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).

Answer 10

<ol>

Question 11

• 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
  display metadata: a list of key-value pairs.
  contain a series of questions and related answers
  contain any other groups of name/value data.
• Can contain multiple terms for a single description or definition
• Can contain multiple definitions or descriptions for a single term.

Answer 11

<dl>

Question 12

• 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).
• Used in conjunction with <dd> (describes each term/name) and both are nested in <dl> (defines a description list)
• This tag alone does not indicate a term being defined (that requires a <dfn> be nested within the tag).

Answer 12

<dt>

Question 13

• 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.

Answer 13

<tr>

Question 14

• The definition description comes in tandem with its term, <dt>; and is nested in a <dl> description list.
• 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)

Answer 14

<dd>

Question 15

• 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

Answer 15

<table>

Question 16

• 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 these elements are regular and left-aligned by default.

Answer 16

<td>

Question 17

• 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).

Answer 17

<caption>

Question 18

• Attribute to a table data element to merge data cells
• (Cells in the rows containing merged cells must then be removed to maintain table symmetry)
• Example coding syntax
  <td \_\_\_\_\_\_\_\_= "number" >
  number = value = number of rows that a single cell should merge across combining the rows height.
• Note: rowspan="0" tells the browser to span the cell to the last row of the table section (thead, tbody, or tfoot).

Answer 18

Rowspan

Question 19

• 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.

Answer 19

<th>

Question 20

• 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.

Answer 20

<tfoot>