CSS Flashcards
1
Q
Which selector targets every instance of a specified HTML element whose specified attribute ends with the specified value?
A
$
element[attribute$=value]
2
Q
Which selector targets every instance of a specified HTML element whose specified attribute contains the specified substring value?
A
*
element[attribute*=value]
3
Q
Which selector targets every instance of a specified HTML element whose specified attribute begins with the specified value?
A
^
element[attribute^=value]
4
Q
Which selector targets every checked instance of a specified HTML element?
A
element:checked
5
Q
Which selector targets every disabled instance of a specified HTML element?
A
element:disabled
6
Q
Which selector targets every enabled instance of a specified HTML element?
A
element:enabled
7
Q
Which selector targets every instance of a specified HTML element that is the first of its parent?
A
element:first-of-type
8
Q
Which selector targets every instance of a specified HTML element that is the last of its parent?
A
element:last-of-type
9
Q
Which selector targets every instance of element2 that is preceded by an instance of element1?
A
element1~element2
10
Q
Which property allows you to set different background properties in one declaration?
A
background
11
Q
Which property specifies whether the background extends into the border or not?
A
background-clip
12
Q
Which property positions the background-image relative to an element’s border, padding or content?
A
background-origin
13
Q
Which property defines the size of background images?
A
background-size
14
Q
Which property creates a border that uses an image instead of a line?
A
border-image
15
Q
Which property defines the shape or curve of a border around an HTML element?
A
border-radius
16
Q
Which property applies shadows to edges of HTML elements to create visual depth?
A
box-shadow
17
Q
Which two values are required to create a box-shadow?
A
h-shadow and v-shadow
18
Q
Which property specifies transparency for an HTML element?
A
opacity
19
Q
Which property defines whether an HTML element can be resized by the user and how it can be resized?
A
resize
20
Q
Which property cuts off, or clips, text that extends beyond its container?
A
text-overflow
21
Q
Which property applies shadows to edges of text characters to create visual depth?
A
text-shadow
22
Q
Which rule allows developers to specify custom fonts?
A
@font-face
23
Q
Which two properties are required to specify a custom font?
A
font-family — specifies the font name
src — identifies the font file’s location by URL
24
Q
Which property specifies how the font should be stretched or spaced?
A
font-stretch
25
Which **property** specifies how the font should be styled vertical or slanted?
font-style
26
Which **property** specifies the weight or thickness of each character in the font?
font-weight
27
Which **property** specifies the range of UNICODE characters that should be downloaded for the font, based on availability?
unicode-range
28
Which **property** specifies whether (and how) punctuation characters can appear outside the line box at the beginning or end of a full line of text?
hanging-punctuation
29
Which **property** specifies whether (and how) punctuation characters can be trimmed or sized when they appear at the beginning or end of a line?
punctuation-trim
30
Which **property** specifies a justification style for the last line in a text block whose text-align property is set to "justify"?
text-align-last
31
Which **property** applies emphasis style and color to an HTML element's text in a single declaration?
text-emphasis
32
Which **property** specifies a justification style for text whose text-align property is set to "justify"?
text-justify
33
Which property specifies whether lines of text in a text area can break, and where a line can be broken? This property is no longer supported.
text-wrap
34
Which **property** specifies whether lines of text in a text area can break, and where a line can be broken?
word-break
35
Which **property** specifies that long words in a text area may be broken without a hyphen and wrap to the next line?
word-wrap
36
Which **property** applies a 2D or 3D transformation to an HTML element, including rotating, moving, skewing, scaling and so forth?
transform
37
Which **property** allows you to change a transformed HTML element's position?
transform-origin
38
Which **property** specifies whether child elements will retain the parent element's position in 3D space?
transform-style
39
Which **transform** value specifies the bottom position of a 3D element?
perspective-origin
40
Which **transform** value defines whether or not an element is visible when it is rotated to face away from the viewer?
backface-visibility
41
Which **transform** value rotates the HTML element clockwise at the specified degree?
transform:rotate(angle)
42
Which **transform** value increases or decreases the size of the HTML element, based on specified parameters for width and height?
transform:scale(x,y)
43
Which **transform** value changes the HTML element's width?
transform:scaleX(n)
44
Which **transform** value changes the HTML element's height?
transform:scaleY(n)
45
Which **transform** value combines all of the 2D transform methods into one?
transform:matrix(n,n,n,n,n,n)
46
Which **transform** value moves the HTML element from its current position, based on the specified parameters for the left and top position?
transform:translate(x,y)
47
Which **transform** value moves the HTML element horizontally?
transform:translateX(n)
48
Which **transform** value moves the HTML element vertically?
transform:translateY(n)
49
Which **transform** value turns or skews the HTML element to a specified angle, based on the specified parameters for the horizontal and vertical lines?
transform:skew(x-angle,y-angle)
50
Which **transform** value turns or skews the HTML element to a specified angle along its X-axis?
transform:skewX(angle)
51
Which **transform** value turns or skews the HTML element to a specified angle along its Y-axis?
transform:skewY(angle)
52
Which **transform** value rotates the HTML element around its X-axis at the specified degree?
transform:rotateX(angle)
53
Which **transform** value rotates the HTML element around its Y-axis at the specified degree?
transform:rotateY(angle)
54
Which **transform** value rotates the HTML element around its Z-axis at the specified degree?
transform:rotateZ(angle)
55
Which **transform** value defines a 3D rotation by specifying the degree for rotation for all axes?
transform:rotate3d(x,y,z,angle)
56
Which **transform** value increases or decreases the size of the HTML element, based on specified parameters for width, height and depth?
transform:scale3d(x,y,z)
57
Which **transform** value defines a 3D scale transformation by specifying a value for the X-axis?
transform:scaleX(x)
58
Which **transform** value defines a 3D scale transformation by specifying a value for the Y-axis?
transform:scaleY(y)
59
Which **transform** value defines a 3D scale transformation by specifying a value for the Z-axis?
transform:scaleZ(z)
60
Which **transform** value defines a 3D translation using specified parameters for positions on the X-axis, Y-axis and Z-axis?
transform:translate3d(x,y,z)
61
Which **transform** value defines a 3D translation using only the value for the X-axis?
transform:translateX(x)
62
Which **transform** value defines a 3D translation using only the value for the Y-axis?
transform:translateY(y)
63
Which **transform** value defines a 3D translation using only the value for the Z-axis?
transform:translateZ(z)
64
Which **transform** value defines a 3D transformation using a 4x4 matrix of 16 values?
transform:matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)
65
Which **transform** value defines a perspective view for a 3D transformed element?
transform:perspective(n)
66
Which **property** specifics the four transition properties into a single property?
transition
67
If you do not specify the duration for a CSS transition, what happens?
No transition will occur
68
Which **property** specifies the CSS property that the transition will affect?
transition-property
69
Which **property** defines the amount of time that a transition takes?
transition-duration
70
Which **property** describes the speed of a transition?
transition-timing-function
71
Which **property** defines when the transition will begin?
transition-delay
72
Which **rule** defines the animation?
@keyframes
73
How can you define the position of an animation using the @keyframes **rule**?
div {
animation: mymove 5s infinite;
}
@keyframes mymove {
0% {top: 0px;}
25% {top: 200px;}
}
74
How can you define the position of an animation using the @keyframes **rule**?
By specifying a percentage from 0% to 100%
or by using the keywords "to" and "from"
75
Which **property** combines all the animation properties, except animation-play-state?
animation
76
Which **property** specifies the identifier for the @keyframes animation that binds it to a selector?
animation-name
77
Which **property** specifies how long the animation will take to complete one cycle?
animation-duration
78
Which **property** specifies how an animation progresses over one cycle?
animation-timing-function
79
Which **property** specifies when the animation will begin?
animation-delay
80
Which **property** specifies the number of times that the animation will play?
animation-iteration-count
81
Which **property** specifies whether to play the animation in reverse on alternate cycles?
animation-direction
82
Which **property** specifies whether the animation is running or paused?
animation-play-state
83
Which **property** makes an HTML element look like a standard user interface element, such as a button or window?
appearance
84
Which **property** forces specified HTML elements fit an area in a certain way?
box-sizing
85
Which **property** styles an HTML element with an iconic equivalent?
icon
86
Which **property** specifies where the cursor will navigate to when the user presses the arrow-down key?
nav-down
87
Which **property** specifies the tabbing order for an HTML element?
nav-index
88
Which **property** specifies where the cursor will navigate to when the user presses the arrow-left key?
nav-left
89
Which **property** specifies where the cursor will navigate to when the user presses the arrow-right key?
nav-right
90
Which **property** specifies where the cursor will navigate to when the user presses the arrow-up key?
nav-up
91
Which **property** draws an outline beyond the border edge as specified?
outline-offset
92
What happens when you assign a negative z-index value to an element?
The element will display behind other elements.
93
Which **property** specifies the stack order of an HTML element?
z-index
94
What consists of a **property** and a **value**?
declaration
95
What is a format instruction that consists of a specified selector and the properties and values applied to it?
rule
96
What is used to "find" the HTML elements you want to style with CSS?
selector
97
What is an **attribute** that can be customized to change the way the element renders in the browser?
property
98
What is a specific selection for a **property**?
value
99
Which **selector** targets all elements with a specific HTML class attribute assigned?
class selector
100
Which **selector** targets one HTML element with a specific id attribute assigned?
id selector
101
How do you create an **ID** selector?
#myElement {color:blue;}
102
How do you create a **tag** selector?
div {color:blue;}
103
How do you create a **class** selector?
.myElement {color:blue;}
104
Which **selector** targets all HTML elements based on a certain state?
pseudo selector
105
Which **selector** targets all HTML elements based on the element name?
tag selector
106
What technique checks a client device, or media type, then limits the scope of the page design to a specific range?
media query
107
What technique is used to place an HTML element on top of another HTML element?
overlay
108
What is a text file that contains CSS formatting instructions?
External style sheet
109
What are styles added to the of individual an HTML document?
Embedded or Internal style sheet
110
What is style added directly into the HTML element tag to which you want to apply the style?
Inline styles
111
How do you create a comment in CSS?
/* A comment is added here */
112
****Which element connects an external style sheet to an HTML document?
\
113
Which **property** is used for positioning and formatting content to the text in a container?
float
114
Which **property** specifies what elements can float beside the cleared element and on which side?
clear
115
Which **positioning scheme** positions an element according to the normal flow of the page?
static
116
Which **positioning scheme** positions an element in relationship to its normal position?
relative
117
Which **positioning scheme** positions an element in relationship to the viewport, meaning it always stays in the same place even if the page is scrolled?
fixed
118
Which **positioning scheme** positions an element in relationship to the nearest positioned ancestor?
absolute
119
Which **property** defines the transparent area inside of the border?
padding
120
Which **property** defines the transparent area outside of the border?
margin
121
What **model** configures the space around each HTML element?
box model
122
Which **property** specifies the vertical alignment of an element?
vertical-align
123
What does this **rule** do?
h3~p {color: red;}
formats every \ element that is preceded by an \ element as red text
124
Which W3C technology is used to apply formatting instructions to markup language documents?
Cascading Style Sheets (CSS)
