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

Code to align images: right

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

7 years ago

Date created

Mar 1, 2020

Cards (44)

Section 1

(44 cards)

Code to align images: right

Front

CSS file: img.floatright {float:right; margin:5px;} HTML file: <img src="x.png" class="floatright" />

Back

Code to align images: bottom

Front

CSS file: img.bottom {vertical-align:baseline;} HTML file: <img src="x.png" class="bottom" />

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. In hexadecimal, the number 10 is represented as the letter A, 15 is represented as F, and 16 is represented as 10.

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

transparency

Front

The ability to make any part of the image invisible so the page background shows through. The image thus appears to blend into the background

Back

font-family

Front

Specifies the typeface (i.e., font name) to be used for text

Back

browser-safe color palette

Front

A standard of 216 colors that would render consistently in all browsers

Back

<header>

Front

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

Back

non-breaking space

Front

&nbsp;

Back

Code to align images: top

Front

CSS file: img.top {vertical-align:top;} HTML file: <img src="x.png" class="top" />

Back

Name two benefits of using CSS?

Front

Consistency — CSS easily gives an entire site a consistent look and feel. Easy change management — You have the ability to change the look and feel of an entire site by simply changing one part of a single line of code, rather than having to change possibly thousands of lines in hundreds of Web pages.

Back

animation

Front

A series of images appearing in sequence to create the effect of motion

Back

<article>

Front

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

Back

alternative text

Front

Specified text to appear while the graphic is loading, or in place of the graphic in non-graphical browsers such as Lynx. This alternative text will also display if the image fails to load or if the user has configured his or her browser not to display images.

Back

font-size

Front

Specifies default font size values in pixels, with 16 being the normal size of default text. Headings (h1 through h6) should be used whenever possible instead of the font-size property

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

GIF (Graphics Interchange Format)

Front

Best suited for line art, custom drawings and navigational images, allows animation

Back

How many versions of CSS are there?

Front

Three

Back

background image

Front

Specifies an image used for the webpage's background

Back

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

Front

<img src="x.png">

Back

What is the code to stylize a horizontal rule?

Front

<hr style="x:y;"/>

Back

What is the code to align images to text?

Front

img.floatleft { float: left; margin: 5px; } <img src="x.png" style="float:left; margin: 5px;" />

Back

selector

Front

In a style sheet, any element to which designated styles are applied.

Back

inheritance

Front

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

Back

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

Front

<img src="imagename.gif" height="10px" width="10px"/>

Back

text color

Front

Specifies the color of the text.

Back

Describe differences in , JPEG, and PNG

Front

GIF 89a - Animation Jpeg - No transparency Png - Transparency, lossless compression

Back

compression

Front

Reducing image quality to limit the space taken up

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

Back

Code to align images: left

Front

CSS file: img.floatleft {float:left; margin:5px;} HTML file: <img src="x.png" class="floatleft" />

Back

<footer>

Front

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

Back

Code to align images: middle

Front

CSS file: img.middle {vertical-align:middle; margin:5px;} HTML file: <img src="x.png" class="middle" />

Back

Portable Network Graphics (PNG)

Front

Brings together the best features of the GIF and JPEG formats into one format, including lossless compression

Back

interlacing

Front

The ability for an image to render gradually as it downloads

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.

Back

rule

Front

In a style sheet, a format instruction that consists of a specified selector and the properties and values applied to it.

Back

How do you create an ampersand using code?

Front

&amp; or &#38;

Back

<aside>

Front

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

Back

<nav>

Front

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

Back

font color

Front

Specifies default font color. Uses the same values for specifying a page background color

Back

What are 3 universally supported Web image formats?

Front

.jpg/.jpeg, .png & .gif

Back

background color

Front

Specifies the color of the webpage's background

Back

hyperlink color (two types)

Front

Specifies the color of both visited and unvisited hyperlinks

Back