Go on. Explore!

lvl 0 • 0 xp

lvl 1

Home Market Decks Interests

CSS

memorize.ai (lvl 286)

(0)

98 cards

()

Section 1

Preview this deck

CSS

Front

1 / 98

CSS Web Dev

0.0

0 reviews

5			0
4			0
3			0
2			0
1			0

Active users

All-time users

Favorites

Last updated

7 years ago

Date created

Mar 1, 2020

Cards (98)

Section 1

(50 cards)

CSS

Front

Cascading Stylesheets

Back

font-size values

Front

xx-small, x-small, small, medium, large, x-large, xx-large, larger, smaller, length, percentage

Back

text-transform: keyword values

Front

capitalize, uppercase, lowercase, none, full-width

Back

font-weight

Front

specifies the weight (or boldness) of the font. The font weights available to you will depend on the font-family you are using. Some fonts are only available in normal and bold.

Back

cursor general values

Front

auto, default, none

Back

relative units

Front

%, em, vw, vh

Back

text-align:

Front

describes how inline content like text is aligned in its parent block element. It does not control the alignment of block elements, only their inline content.

Back

background-color

Front

property sets the background color of an element

Back

What is the Web Content Accessibility Guides ratio for text content?

Front

4.5:1

Back

font-weight: keyword values

Front

normal, bold

Back

color

Front

sets the foreground color value of an element's text content and text decorations. It also sets the currentcolor value, which may be used as an indirect value on other properties, and is the default for other color properties, such as border-color.

Back

height values

Front

length, percentage, auto

Back

font-size

Front

specifies the size of the font. Setting this property may change the size of other items, too, since it is used to compute the value of em, ex, and various other relative <length> units.

Back

cursor

Front

specifies which mouse cursor to display when the mouse pointer is over an element

Back

What is a CSS ruleset made up of?

Front

1) selector, which is the code that selects HTML elements that you want to style 2) declaration block, which is the code that describes the styles you want to apply said HTML

Back

cursor drag & drop values

Front

alias, copy, move, no-drop, not-allowed, grab, grabbing

Back

How is color contrast ratio determined?

Front

by comparing the luminosity of the text and background color values.

Back

font-style

Front

property specifies whether a font should be styled with a normal, italic, or oblique face from its font-family.

Back

Front

HTML comment

Back

font-weight: global values

Front

inherit, initial, unset

Back

cursor links & status values

Front

context-menu, help, pointer, progress, wait

Back

width

Front

shorthand for setting both the min-width and the max-width of the viewport

Back

text-transform: global values

Front

inherit, initial, unset

Back

Accessibility concerns with font-weight

Front

People experiencing low vision conditions may have difficulty reading text set with a font-weight value of 100 (Thin/Hairline) or 200 (Extra Light), especially if the font has a low contrast color ratio.

Back

box-shadow

Front

used to add shadow effects around an element's frame. You can specify multiple effects separated by commas if you wish to do so. A box shadow is described by X and Y offsets relative to the element, blur and spread radii, and color.

Back

CSS descriptor

Front

describes the characteristics of an at-rule

Back

absolute units

Front

px, mm, in, cm

Back

at-rule

Front

CSS statement that instructs CSS how to behave. They begin with an at sign, '@' (U+0040 COMMERCIAL AT), followed by an identifier and includes everything up to the next semicolon, ';' (U+003B SEMICOLON), or the next CSS block, whichever comes first.

Back

font-family

Front

specifies a prioritized list of one or more font family names and/or generic family names for the selected element

Back

cursor resizing & scrolling values

Front

all-scroll, col-resize, row-resize, n-resize, e-resize, s-resize, w-resize, ne-resize, nw-resize, se-resize, sw-resize, ns-resize nesw-resize, nwse-resize

Back

text-decoration: values

Front

text-decoration-line, text-decoration-color, text-decoration-style

Back

box-shadow values

Front

inset, <offset-x> <offset-y>, <blur-radius>, <spread-radius>, <color>

Back

font-style: values

Front

normal, italic, oblique

Back

width values

Front

auto, length, percentage

Back

text-decoration

Front

specifies the appearance of decorative lines used on text. It is a shorthand for setting one or more individual text-decoration values in a single declaration, which include text-decoration-line, text-decoration-color, and text-decoration-style.

Back

What are the accessibility concerns with the color property

Front

It is important to ensure that the contrast ratio between the color of the text and the background the text is placed over is high enough that people experiencing low vision conditions will be able to read the content of the page.

Back

text-transform

Front

specifies how to capitalize an element's text. It can be used to make text appear in all-uppercase or all-lowercase, or with each word capitalized.

Back

border values

Front

none, solid, dashed, dotted, double, groove, ridge, inset, outset, hidden

Back

border

Front

shorthand for setting all individual border property values in a single declaration: border-width, border-style, and border-color

Back

font-weight: keyword values relative to its parent

Front

lighter, bolder

Back

cursor selection values

Front

cell, crosshair, text, vertical-text

Back

margin values

Front

length, percentage, auto

Back

font-family values

Front

<family-name>, <generic-name>, serif, sans-serif, monospace, cursive, fantasy, system-ui

Back

margin

Front

sets the margin area on all four sides of an element. It is a shorthand for setting all individual margins at once: margin-top, margin-right, margin-bottom, and margin-left

Back

What is the Web Content Accessibility Guidelines (WCAG) for larger text such as headings?

Front

3:1

Back

font-weight: numerical keyword values

Front

100-900

Back

CSS Selector

Front

define the elements to which a set of CSS rules apply

Back

cursor zooming values

Front

zoom-in, zoom-out

Back

cursor values

Front

url, <x> <y>

Back

/ /

Front

CSS comment

Back

Section 2

(48 cards)

position

Front

specifies how an element is positioned in a document

Back

display-outside values

Front

block; inline; run-in;

Back

<display-legacy> values

Front

inline-block; inline-table; inline-flex; inline-grid;

Back

<display-internal> values

Front

table-row-group; table-header-group; table-footer-group; table-row; table-cell; table-column-group; table-column; table-caption; ruby-base; ruby-text; ruby-base-container; ruby-text-container;

Back

transform

Front

lets you rotate, scale, skew, or translate a given element. This is achieved by modifying the coordinate space of the CSS visual formatting model.

Back

transition

Front

module of CSS that lets you create gradual transitions between the values of specific CSS properties. The behavior of these transitions can be controlled by specifying their timing function, duration, and other attributes.

Back

absolutely positioned element is an element whose computed position values

Front

absolute or fixed

Back

Child combinator

Front

The > combinator selects nodes that are direct children of the first element. Syntax: A > B Example: ul > li will match all <li> elements that are nested directly inside a <ul> element.

Back

type selector

Front

Selects all elements that match the given node name. Syntax: eltname Example: input will match any <input> element.

Back

position: sticky;

Front

The element is positioned according to the normal flow of the document, and then offset relative to its nearest scrolling ancestor and containing block (nearest block-level ancestor), including table-related elements, based on the values of top, right, bottom, and left. The offset does not affect the position of any other elements. This value always creates a new stacking context. Note that a sticky element "sticks" to its nearest ancestor that has a "scrolling mechanism" (created when overflow is hidden, scroll, auto, or overlay), even if that ancestor isn't the nearest actually scrolling ancestor. This effectively inhibits any "sticky" behavior (see the Github issue on W3C CSSWG).

Back

<style>

Front

contains style information for a document, or part of a document

Back

<display-box> values

Front

contents; none;

Back

display global values

Front

inherit; initial; unset;

Back

display

Front

specifies the type of rendering box used for an element. In HTML, default display property values are taken from behaviors described in the HTML specifications or from the browser/user default stylesheet. The default value in XML is inline, including SVG elements

Back

display-outside plus display-inside values

Front

block flow; inline table; flex run-in

Back

Universal selector

Front

Selects all elements. Optionally, it may be restricted to a specific namespace or to all namespaces. Syntax: ns| | Example: * will match all the elements of the document.

Back

position: relative;

Front

The element is positioned according to the normal flow of the document, and then offset relative to itself based on the values of top, right, bottom, and left. The offset does not affect the position of any other elements; thus, the space given for the element in the page layout is the same as if position were static. This value creates a new stacking context when the value of z-index is not auto. Its effect on table-*-group, table-row, table-column, table-cell, and table-caption elements is undefined.

Back

Pseudo-elements

Front

represent entities that are not included in HTML. Example: p::first-line will match the first line of all <p> elements.

Back

ID selector

Front

Selects an element based on the value of its id attribute. There should be only one element with a given ID in a document. Syntax: #idname Example: #toc will match the element that has the ID "toc".

Back

accessibility concerns with positioned elements

Front

Ensure that elements positioned with an absolute or fixed value do not obscure other content when the page is zoomed to increase text size.

Back

relative positioned elements left and right properties specify what

Front

the horizontal offset

Back

position: absolute;

Front

The element is removed from the normal document flow, and no space is created for the element in the page layout. It is positioned relative to its closest positioned ancestor, if any; otherwise, it is placed relative to the initial containing block. Its final position is determined by the values of top, right, bottom, and left. This value creates a new stacking context when the value of z-index is not auto. The margins of absolutely positioned boxes do not collapse with other margins.

Back

transform keyword values

Front

none

Back

transition properties

Front

-delay, -duration, -property, -timing-function

Back

relative positioned elements top and bottom properties specify what

Front

the vertical offset from its normal position

Back

General sibling combinator

Front

The ~ combinator selects siblings. This means that the second element follows the first (though not necessarily immediately), and both share the same parent. Syntax: A ~ B Example: p ~ span will match all <span> elements that follow a <p>.

Back

transform global values

Front

inherit; initial; unset;

Back

display-inside values

Front

flow; flow-root; table; flex; grid; ruby; subgrid;

Back

effect of top: right: bottom: left: z-index: in static positioned elements

Front

they have no effect they are the default value

Back

in an absolutely positioned element the top, right, bottom, and left properties specify what?

Front

offsets from the edges of the element's containing block. (The containing block is the ancestor relative to which the element is positioned.) If the element has margins, they are added to the offset.

Back

<display-listitem> values

Front

list-item; list-item block; list-item inline; list-item flow; list-item flow-root; list-item block flow; list-item block flow-root; flow list-item block;

Back

::before

Front

creates a pseudo-element that is the first child of the selected element. It is often used to add cosmetic content to an element with the content property

Back

transform function values

Front

matrix(); translate/X/Y(); scale/X/Y(); rotate(); skew/X/Y(); matrix3d(); translate3d(); scale3d(); scaleZ(); rotate3d/X/Y/Z(); perspective();

Back

declaration block

Front

The selector points to the HTML element you want to style. The declaration block contains one or more declarations separated by semicolons. Each declaration includes a CSS property name and a value, separated by a colon.

Back

positioned: fixed;

Front

The element is removed from the normal document flow, and no space is created for the element in the page layout. It is positioned relative to the initial containing block established by the viewport, except when one of its ancestors has a transform, perspective, or filter property set to something other than none (see the CSS Transforms Spec), in which case that ancestor behaves as the containing block. (Note that there are browser inconsistencies with perspective and filter contributing to containing block formation.) Its final position is determined by the values of top, right, bottom, and left. This value always creates a new stacking context. In printed documents, the element is placed in the same position on every page.

Back

stylesheet

Front

file containing the code that describes how elements on your webpage should be displayed

Back

Descendant combinator

Front

The combinator selects nodes that are descendants of the first element. Syntax: A B Example: div span will match all <span> elements that are inside a <div> element.

Back

Adjacent sibling combinator

Front

The + combinator selects adjacent siblings. This means that the second element directly follows the first, and both share the same parent. Syntax: A + B Example: h2 + p will match all <p> elements that directly follow an <h2>.

Back

transform multiple function values

Front

translateX() rotate() translateY();

Back

stickily positioned element is an element whose computer position value is

Front

sticky

Back

Pseudo-classes

Front

allow the selection of elements based on state information that is not contained in the document tree. Example: a:visited will match all <a> elements that have been visited by the user.

Back

Attribute selector

Front

Selects elements based on the value of the given attribute. Syntax: [attr] [attr=value] [attr~=value] [attr|=value] [attr^=value] [attr$=value] [attr*=value] Example: [autoplay] will match all elements that have the autoplay attribute set (to any value).

Back

<link>

Front

specifies relationships between the current document and an external resource. Possible uses for this element include defining a relational framework for navigation. This element is most used to link to style sheets

Back

content

Front

is used with the ::before and ::after pseudo-elements to generate content in an element. Objects inserted using the content property are anonymous replaced elements

Back

How are stickily positioned elements treated?

Front

as relatively positioned until its containing block crosses a specified threshold (such as setting top to value other than auto) within its flow root (or the container it scrolls within), at which point it is treated as "stuck" until meeting the opposite edge of its containing block.

Back

class selector

Front

Selects all elements that have the given class attribute. Syntax: .classname Example: .index will match any element that has a class of "index".

Back

padding

Front

sets the padding area on all four sides of an element. It is a shorthand for setting all individual paddings at once: padding-top, padding-right, padding-bottom, and padding-left

Back

a positioned element may have which computer positions

Front

relative; absolute; fixed; sticky;

Back