HTML Flashcards
HTML stands for
Hyper Text Markup Language
What is an HTML Element?
An HTML element is defined by a start tag, some content, and an end tag
HTML links are defined with the
<a> tag</a>
The link’s destination is specified in the _____attribute.
href
HTML elements with no content are called _____ elements.
empty <br></br>
The <br></br> tag defines a
line break
HTML attributes provide ________________ about HTML elements.
additional information
Syntax of href Attribute
a href=”URL”
The <a> tag defines a hyperlink. The href attribute specifies the URL of the page the link goes to.</a>
Syntax of src Attribute
img src=”source” alt=”alt text” width=”500” height=”600”
The <img></img> - embed an image. The src attribute - path to the image to be displayed.
The title attribute defines
Some extra information about an element.
The value of the title attribute will be displayed as a tooltip when you mouse over the element
Syntax of title Attribute
p title=”I’m a tooltip” This is a paragraph.</p>
HTML headings are defined with the
<h1> to <h6> tags.
</h6></h1>
The HTML __ element defines a paragraph.
<p>
A paragraph always starts on a new line, and browsers automatically add some white space (a margin) before and after a paragraph.
</p>
_____ tag defines a thematic break in an HTML page, and is most often displayed as a horizontal rule.
<hr></hr>
The HTML ____ element defines preformatted text.
<pre>
The text inside a <pre> element is displayed in a fixed-width font (usually Courier), and it preserves both spaces and line breaks:
</pre></pre>
The HTML style attribute is used to add styles to ____
an element, such as color, font, size, and more.
Syntax of Style Attribute
body style=”background-color:powderblue;”
The CSS color property defines the______ for an HTML element
text color
h1 style=”color:blue;”
The CSS _______ property defines the font to be used for an HTML element
font-family
h1 style=”font-family:verdana;”
<b> - ___text
<strong> - ____text
<i> - ____text
<em> - ____text</em></i></strong></b>
Bold, Important, Italic , Emphasized
<mark> - \_\_\_\_text (highlighted)
<small> - \_\_\_\_text
<del> - Deleted text (\_\_\_\_\_)
<ins> - Inserted text (\_\_\_\_)</ins></del></small></mark>
Marked, Smaller
strikethrough, underline
- ____text (H2O)
- _____text (half a character above the normal line)
Subscript, Superscript
You can add comments to your HTML source by using the following syntax:
<!-- Write your comments here -->
Text Color
h1 style=”color:Tomato;”
Border Color
h1 style=”border:2px solid Tomato;
RGB color value represents ___
RGBA color value is an extension of RGB with an _____ channel (opacity).
RED, GREEN, and BLUE light sources.
Alpha
RGB Color Values
rgb(red, green, blue)
rgb(255, 255, 255) - white
rgb(0, 0, 0) - black
RGBA Color Values
rgba(red, green, blue, alpha)
The alpha parameter is a number between
___ (fully transparent)
___ (not transparent at all)
0.0
1.0
rgba(255, 0, 0, 0.5)
HEX Color Values
#rrggbb
#ffffff - white
#000000 = black
between 00 and ff (same as decimal 0-255).
HSL stands for ____
HSLA color values are an extension of HSL with an _____channel (opacity).
hue, saturation, and lightness.
Alpha
Hue is a degree on the color wheel from 0 to 360.
0, 360 is ____
120 is ___
240 is ___
Red
Green
Blue
Saturation is a percentage value
0% means a ____
100% is the ___
shade of gray
full color.
Lightness is also a percentage value.
0% means a ____
100% is the ___
black
white
Use the CSS padding property for space _______ the border
inside
Use the CSS margin property for space _____ the border
outside
Link to External CSS syntax
link rel=”stylesheet” href=”url”
HTML Links - Syntax
a href=”url”>link text /a
a tag defines a hyperlink.
HTML Links - Use an Image as a Link
a href=”url”
img src=”smiley.gif” alt=”HTML tutorial” style=”width:42px;height:42px;”
/a
The ____ attribute specifies where to open the linked document.
target
target=”_blank”
An unvisited link is underlined and _____
A visited link is underlined and ____
An active link is underlined and ___
blue
purple
red
_blank - Opens the document in a ___________
_____ - Opens the document in the parent frame
___ - Opens the document in the full body of the window
new window or tab
_parent
_top
Button as a Link:
button onclick=”document.location=’url’“>Text /button
____ - Default. Opens the document in the same window/tab as it was clicked
_self
Link to an Email Address
a href=”mailto:someone@example.com”>Send email /a
Link button and colors
a:link, a:visited {
background-color: # ;
color: text color;
padding: 5px 5px;
text-align: center;
text-decoration: none;
display: inline-block;
}
a:hover, a:active {
background-color: red;
}
____ attribute to create a bookmark:
id
a href=”#C4”>Jump to Chapter 4
h2 id=”C4”>Chapter 4