some data
Quiz yourself by thinking what should be in
each of the black spaces below before clicking
on it to display the answer.
Help!
|
|
||||
---|---|---|---|---|---|
accesskey | Global Attribute
Specifies a shortcut key to activate/focus an element
<element accesskey="character">
<a href=" accesskey="c">CSS3</a>
🗑
|
||||
class | Global Attribute
Specifies one or more classnames for an element (refers to a class in a style sheet)
just Css stuff
🗑
|
||||
contenteditable | Global Attribute
Specifies whether the content of an element is editable or not
<element contenteditable="true|false">
🗑
|
||||
data-* | Global Attribute
Used to store custom data private to the page or application
<element data-*="somevalue">
script stuff, i guess
🗑
|
||||
dir | Global Attribute
Specifies the text direction for the content in an element
<element dir="ltr|rtl|auto">
🗑
|
||||
draggable | Global Attribute
Specifies whether an element is draggable or not
<element draggable="true|false|auto">
Tip: Links and images are draggable by default.
🗑
|
||||
dropzone | Global Attribute
Specifies whether the dragged data is copied, moved, or linked, when dropped
<element dropzone="copy|move|link">
🗑
|
||||
hidden | Global Attribute
Specifies that an element is not yet, or is no longer, relevant
<element hidden>
Sometimes can be used with javascript, which will remove attribute later.
🗑
|
||||
id | Global Attribute
Specifies a unique id for an element
unique id
<element id="id">
🗑
|
||||
lang | Global Attribute
Specifies the language of the element's content
<element lang="language_code"> en, es, fr, ru
🗑
|
||||
spellcheck | Global Attribute
Specifies whether the element is to have its spelling and grammar checked or not
<element spellcheck="true|false">
🗑
|
||||
style | Global Attribute
Specifies an inline CSS style for an element
🗑
|
||||
tabindex | Global Attribute
Specifies the tabbing order of an element
<element tabindex="number">
🗑
|
||||
title | Global Attribute
Specifies extra information about an element
<element title="text">
🗑
|
||||
translate | Global Attribute
Specifies whether the content of an element should be translated or not
<element translate="yes|no">
or class="notranslate"(if first not working)
🗑
|
||||
<!--...--> | Defines a comment
not shown in page. helps comunication between programmers in code
🗑
|
||||
<!DOCTYPE> | Defines the document type
<!DOCTYPE html>
u need it first
🗑
|
||||
<title> | Defines a title for the document
🗑
|
||||
<body> | The page itself and its content
🗑
|
||||
<h1> to <h6> | Size and "importance" of text
🗑
|
||||
<p> | Defines a paragraph.
🗑
|
||||
<br> | Inserts a single line break.
This tag is an empty tag which means that it has no end tag.
Use the <br> tag to enter line breaks, not to separate paragraphs
🗑
|
||||
<hr> | Makes a line.
Has no end tag.
🗑
|
||||
<html> | Tells the browser, that it's html document
🗑
|
||||
<head> | Container for all "head elements":
<title> (this element is required in an HTML document)
<style>
<base>
<link>
<meta>
<script>
<noscript>
🗑
|
||||
<abbr> | Defines an abbreviation or an acronym, like "Mr.", "Dec.", "ASAP", "ATM"
Marking up abbreviations can give useful information to browsers, translation systems and search-engines
🗑
|
||||
<address> | Defines the contact information for the author/owner of a document or an article.
The text in the <address> element usually renders in italic. Most browsers will add a line break before and after the address element.
🗑
|
||||
<b> | bold text
tag should be used as a LAST resort when no other tag is more appropriate. emphasized text should be denoted with the <em> tag, important text should be denoted with the <strong> tag, and marked/highlighted text should use the <mark> tag
🗑
|
||||
<bdi> | Bi-Directional Isolation
isolates a part of text that might be formatted in a different direction from other text outside it
This element is useful when embedding user-generated content with an unknown directionality.
🗑
|
||||
<bdo> | Bi-Directional Override
is used to override the current text direction
works only with "dir" attribute.
🗑
|
||||
<blockquote> | specifies a section that is quoted from another source
Use <q> for inline (short) quotations
attribute: "cite=" "
🗑
|
||||
<code> | old style of text. defined computer code
🗑
|
||||
<del> | strike a line through deleted text
🗑
|
||||
<ins> | underline inserted text
🗑
|
||||
<dfn> | changes style of text
Shows term, that is first seen be reader.
cursive
🗑
|
||||
<em> | changes style of text
It renders as emphasized text.
cursive
🗑
|
||||
<i> | style of text
italic\cursive
Use the <i> element only when there is not a more appropriate semantic element, such as:
<em> <strong> <mark> <cite> <dfn>
🗑
|
||||
<kbd> | old style of text
It defines keyboard input
🗑
|
||||
<mark> | defines marked text. looks like marker.
🗑
|
||||
<meter> | defines a scalar measurement within a known range, or a fractional value. This is also known as a gauge.
For progress bars, use the <progress> tag
attributes:
form, high, low, max, min, optimum, value
<meter min="0" low="40" high="90" max="100" value
🗑
|
||||
form | attribute of "meter"
didn't get it...
🗑
|
||||
<pre> | Defines preformatted text.
it will be shown as u formatted it in notepad: with spaces and linebreaks.
🗑
|
||||
<progress> | represents progress. works good with javascript.
attributes: max, value
🗑
|
||||
<q> | short quotation
🗑
|
||||
<rp>,<rt>, <ruby> | japaneese stuff. used to show pronunciation or meaning of the corresponding characters.
🗑
|
||||
<s> | specifies text that is no longer correct, accurate or relevant
use the <del> tag to define replaced or deleted text
🗑
|
||||
<samp> | old style of text
defines sample output from a computer program
🗑
|
||||
<small> | defines smaller text (and other side comments)
🗑
|
||||
<strong> | old style of text
defines important text
🗑
|
||||
<sub> | defines subscript text. Subscript text appears half a character below the normal line, and is sometimes rendered in a smaller font.
🗑
|
||||
<sup> | defines superscript text. Superscript text appears half a character above the normal line, and is sometimes rendered in a smaller font.
🗑
|
||||
<template> | tag holds its content hidden from the client.
Use the tag when you have HTML code you want to use over and over again, but not until you ask for it.
🗑
|
||||
<time> | defines a human-readable date/time.
This element can also be used to encode dates and times in a machine-readable way to make some sheduled events.
attribute: datetime
🗑
|
||||
<u> | Represents some text that should be stylistically different from normal text, such as misspelled words or proper nouns in Chinese.
just line under text. can be mistaken as hyperlink. old style of text.
🗑
|
||||
<var> | old style of text
a phrase tag. It defines a variable.
🗑
|
||||
<wbr> | Word Break Opportunity
specifies where in a text it would be ok to add a line-break
When a word is too long, or you are afraid that the browser will break your lines at the wrong place, you can use the <wbr> element to add word break opportunities.
🗑
|
||||
<form> | Used to create an HTML form for user input.
elements: <input><textarea><button><select><option><optgroup><fieldset><label>
attribute: accept, accept-charset, action, autocomplete, enctype, method, name, novalidate, target.
🗑
|
||||
<input> | specifies an input field where the user can enter data
a lot of attributes.
🗑
|
||||
<textarea> | defines a multi-line text input control.
a lot of attributes.
🗑
|
||||
<button> | a clickable button
🗑
|
Review the information in the table. When you are ready to quiz yourself you can hide individual columns or the entire table. Then you can click on the empty cells to reveal the answer. Try to recall what will be displayed before clicking the empty cell.
To hide a column, click on the column name.
To hide the entire table, click on the "Hide All" button.
You may also shuffle the rows of the table by clicking on the "Shuffle" button.
Or sort by any of the columns using the down arrow next to any column heading.
If you know all the data on any row, you can temporarily remove it by tapping the trash can to the right of the row.
To hide a column, click on the column name.
To hide the entire table, click on the "Hide All" button.
You may also shuffle the rows of the table by clicking on the "Shuffle" button.
Or sort by any of the columns using the down arrow next to any column heading.
If you know all the data on any row, you can temporarily remove it by tapping the trash can to the right of the row.
Embed Code - If you would like this activity on your web page, copy the script below and paste it into your web page.
Normal Size Small Size show me how
Normal Size Small Size show me how
Created by:
Phoes
Popular Computers sets