Lesson 3: Cascading Style Sheets (CSS) and Graphical Elements

Lesson 3: Cascading Style Sheets (CSS) and Graphical Elements

memorize.aimemorize.ai (lvl 286)
Section 1

Preview this deck

non-breaking space

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 (44)

Section 1

(44 cards)

non-breaking space

Front

ensures an indentation before the line "This begins an indented paragraph

Back

What is the code to create an image on a Web page?

Front

<img src="imagefile.png" alt="Alternative text goes here"/>

Back

Describe differences in GIF 89a, JPEG, and PNG

Front

Gif 89a and PNG have all transparency, interlacing, compression, and animation. JPEG only has Compression.

Back

hyperlink color (two types)

Front

a:link {color:#0000FF;} {color:blue;} Determines the color of unvisited links a:visited "{color:#FF0000;} {color:red;} Determines the color of visited links

Back

How do you create an ampersand using code?

Front

&amp; or &#38;

Back

How many versions of CSS are there?

Front

Cascading Style Sheets (CSS1), Cascading Style Sheets 2 (CSS2), Cascading Style Sheets 3 (CSS3)

Back

inheritance

Front

The style you define will flow, or cascade, throughout the documents, unless another style defined inside of a page specifically overrides it.

Back

Name two benefits of using CSS?

Front

Consistency; Easy change management

Back

Code to align images: left

Front

<img src="syb/SYBcollage2.png" class="floatleft" />

Back

animation

Front

less popular than animated GIF, but gaining attention

Back

What is the code to stylize a horizontal rule?

Front

<hr/>

Back

Tips for creating Web Page layout (list 5)

Front

Be succinct — Limit words to clear, necessary verbiage, especially on the home page. Most users simply scan pages quickly looking for specific information or links to it. Let users navigate to additional pages if they want more information. Make sure that each page focuses on one topic — No tangent message, regardless of its importance, should be added to a page. Use links to point users to appropriate related topics on separate pages. Divide the page into three sections — Use the left side of the page for navigation, the upper section of the page for a topic title (as well as navigation), and the middle section of the page for the information. Include navigation aids — A common way to enable navigation is to place links at the top and bottom of the page, and within the body of the page, to reduce the need for users to scroll. Place comments in each section of code — Comments help explain changes you have made to the code or page. You can indicate the nature of the change, including the date you made the change and your name or initials, or you can explain the nature of the markup. For example, the syb.html page has three headings (h1, h2 and h3). You could comment each of these sections of the narrative.

Back

What are 3 universally supported Web image formats?

Front

GIF, JPEG, PNG

Back

compression

Front

lossless, unlike standard JPEG compression. Also, the compression used in the PNG format is not copyrighted, which has helped ensure developer and user agent vendor support.

Back

font color

Front

uses the same values that you learned for specifying a page background color.

Back

hexadecimal

Front

A base-16 number system that allows large numbers to be displayed by fewer characters than if the number were displayed in the regular base-10 system.

Back

GIF (Graphics Interchange Format)

Front

GIFs are best suited for line art, custom drawings and navigational images.

Back

Code to align images: middle

Front

<img src="syb/SYBcollage2.png" class="middle" />

Back

font-family

Front

specifies the typeface (i.e., font name) to be used. A font-family value must include quotation marks if it has multiple words, such as "Times New Roman."

Back

<header>

Front

Top of the Web page, similar to the header in a word-processing document.

Back

text color

Front

To designate the color of text on a page, use the color property in the body selector of the CSS file.

Back

JPEG (Joint Photographic Experts Group)

Front

typically used for photographs and complex images.

Back

dithering

Front

The ability for a computer to approximate a color by combining the RGB values.

Back

Code to align images: top

Front

<img src="syb/SYBcollage2.png" class="top" />

Back

Code to align images: bottom

Front

<img src="syb/SYBcollage2.png" class="bottom" />

Back

background image

Front

a graphic file used in place of a background color

Back

What is the code to align images to text?

Front

<img src="syb/SYBcollage2.png" class="floatleft" /> AND <img src="syb/SYBcollage2.png" style="float:left; margin: 5px;" />

Back

Portable Network Graphics (PNG)

Front

depth can be adjusted, also use compression filters that can support up to 48-bit color.

Back

<aside>

Front

Content that is "aside" from the article content, such as advertisements or news feeds.

Back

font-size

Front

takes values in pixels, with 16 being the normal size of default text. The font-size value is specified with the "px" abbreviation for "pixels." No spaces can exist between the number value and the abbreviation. For example, font-size=16 px would not render properly, but font-size=16px (with no space) would work correctly. Headings (h1 through h6) should be used whenever possible instead of the font-size property.

Back

fixed-width layout

Front

also known as absolute positioning. Achieved by assigning specific pixel widths to elements using the HTML5 structural elements or the <div> tag. This layout ensures that the text, images and layout will not vary from browser to browser. The problem with using a fixed-width layout is that the elements may not render as expected when users change the size of their browser windows.

Back

rule

Front

The name for a selector, property and value all grouped together

Back

<nav>

Front

Defines navigation links, such as hypertext menus to access various pages of the Web site.

Back

<article>

Front

Web site content, such as company services, articles, blogs, images and videos.

Back

background color

Front

To specify a color for a page background, you add the background-color property to the body selector in an external CSS file

Back

liquid layout

Front

also known as relative positioning. Achieved by assigning percentage values to elements. With this layout, the size of an element is flexible and will change dynamically depending on the size of the browser window. For example, you can specify in the CSS width property that Element A will occupy 35 percent of the screen and Element B will occupy the remaining 65 percent. If the user resizes the browser window, the elements will resize correspondingly.

Back

selector

Front

Any element you want to affect

Back

<footer>

Front

Bottom of the Web page, similar to the footer in a word-processing document.

Back

interlacing

Front

similar to GIF 89a.

Back

transparency

Front

similar to GIF 89a.

Back

alternative text

Front

display if the image fails to load or if the user has configured his or her browser not to display images.

Back

What are the two codes to adjust width and height of images?

Front

<img src="imagename.gif" height="HeightInPixels" width="WidthInPixels"/>

Back

browser-safe color palette

Front

a standard of 216 colors that would render consistently

Back

Code to align images: right

Front

<img src="syb/SYBcollage2.png" class="floatright" />

Back