Chapter 3- Creating Web Pages with Links, Images, and Embedded Style Sheets

Chapter 3- Creating Web Pages with Links, Images, and Embedded Style Sheets

memorize.aimemorize.ai (lvl 286)
Section 1

Preview this deck

Using Embedded Style Sheets

Front

Star 0%
Star 0%
Star 0%
Star 0%
Star 0%

0.0

0 reviews

5
0
4
0
3
0
2
0
1
0

Active users

0

All-time users

0

Favorites

0

Last updated

6 years ago

Date created

Mar 1, 2020

Cards (41)

Section 1

(41 cards)

Using Embedded Style Sheets

Front

add <style> tags between the <head> tags Selector: h1 (the element you want to change) Declaration: (all attributes and their values you want to them to them) Example: <style type="text/css"> <!-- h1 {font-family: Garamond; font-size: 32 pt;} --> </style>

Back

CSS Properties- background

Front

can control: -color -image -position

Back

CSS Properties- margin

Front

can control: -length -percentage

Back

Path

Front

describes the location (folder or external website) where the files can be found

Back

CSS Properties- border

Front

can control: -color -style -width

Back

font-weight

Front

-changes the weight of the font -values include normal, bold, bolder, and lighter

Back

<em> </em>

Front

displays text with emphasis (usually appears as italicized)

Back

<strong></strong>

Front

logical style tag that displays text with strong emphasis (usually appears bold)

Back

<small> </small>

Front

decreases the font-size in comparison to the surrounding text

Back

Adding an Image with Wrapped Text

Front

Float property: indicates which direction to display the element <img style="float: left;"> <img style="float: right;"> or <img class="align-left"> <img class="align-right"> img.align left {float: left; margin-left: 5px; margin-right: 5px;} img.align right {float: right; margin-left: 5px; margin-right: 5px;}

Back

Anchor tag<a> attribute- type

Front

Specifies the content type (also known as media types or MIME types) of the linked page or file to help a browser determine if it can handle the resource type. Examples: text/html, video/quicktime, application/java, text/css, and text/javascript

Back

<sub> </sub>

Front

displays text as subscript

Back

Anchor tag<a> attribute- rel

Front

specifies the relationship between the current document and the linked document. the value of the rel attribute is a link type, such as prev, next, author, or license. For example: <a rel="next" href="chapter4.html"> indicate a link to the web page for the next chapter

Back

CSS Properties- font

Front

can control: -family -size -style -variant -weight

Back

Linking to an email address

Front

<a href="mailto:underwatertoursbyeloise@isp.com">underwatertoursbyeloise@isp.com</a>

Back

Absolute Path

Front

specifies the exact address for the file to which you are linking or displaying a graphic

Back

Anchor tag

Front

<a> create anchors for links to another page in the same Website

Back

Class

Front

you can define specific elements of an HTML file as a category; you can then create a specific style for each class ex: <p class="classname"> calling it from a style statement: p.classname {color: red; font-size: 20pt;} .classname {olor: red; font-size: 20pt;}

Back

Linking to another website

Front

Example: <a href="http://www.nps.gov/state/hi/index.htm">one of our fabulous tour destinations</a>

Back

Change the color of text links

Front

External Style Sheet: a {color: black;} Inline Style: <a style="color: black">

Back

color

Front

-changes font color -values include six digit (hexadecimal) color codes, color names, or RGB values

Back

Add an Inline Style for Color

Front

<p><span style="color: #020390; font-weight: bold"> sldfkjalksdfjoiwefklsdfjk </span></p>

Back

font-style

Front

-changes the style of the font -values include normal, italic, and oblique

Back

font-family

Front

-changes the font face or type -values include fonts, such as Verdana or Arial; text appears using the default font if the font face is not specified

Back

<blockquote> </blockquote>

Front

a long quotation, indents margins on sections of text

Back

Adding other information to an e-mail link

Front

add a subject <a href="mailto:underwatertoursbyeloise@isp.com?subject=Maui tours">

Back

<sup> </sup>

Front

displays text as superscript

Back

Adding Links Within a Web Page

Front

<a id="targetname"></a> <a href="#targetname">

Back

<pre> </pre>

Front

sets enclosed text as preformatted material. meaning it preserves spaces and line breaks; often used for text in column formet in another document pasted into HTML code

Back

Linking to another html file

Front

Example: <a href="samplephotos.html">sample photographs</a>

Back

Linking within a web page

Front

Use ID as a link <a id="fish"></a> <a href="#fish">Frog Fish</a>

Back

font-size

Front

-changes the font size -value can be an actual numeric size, a percentage, or values such as large, medium, small, etc.

Back

Anchor Tag<a> attribute- id

Front

Defines a name (or id) for the current anchor so it may be the target or destination of another link. each anchor on a Web page must use an unique id

Back

CSS Properties- list

Front

can control: -image -position -type

Back

CSS Properties- text

Front

can control: -alignment -color -decoration -indentation -spacing -white space

Back

Add a text link to another web page within the same website

Front

<a href="URL">linktextname</a> example: <a href="samplephotos.html">sample photographs</a>

Back

Using Thumbnail Images

Front

Code to add a thumbnail image that links a larger image: <a href="largeimage.gif"><img src="thumbnail.gif" /></a>

Back

Add Embedded Style Sheet Statements

Front

<style type ="text/css"> <!--- --> </style>

Back

To Clear Text Wrapping

Front

<br style="clear: left" /> <br style="clear: right" />

Back

Anchor Tag<a> atrribute- href

Front

specifies the URL of the linked page or file

Back

Change the underline of text links

Front

External Style Sheet: a {text-decoration: none;} Inline Style: <a style="text-decoration: none">

Back