Download CSS Visual effects for frontend and more Exams Engineering in PDF only on Docsity!
CSS Visual effects for frontend
element[attribute$=value] - Which selector targets every instance of a specified HTML element whose specified attribute ends with the specified value? element[attribute*=value] - Which selector targets every instance of a specified HTML element whose specified attribute contains the specified substring value? element[attribute^=value] - Which selector targets every instance of a specified HTML element whose specified attribute begins with the specified value? element:checked - Which selector targets every checked instance of a specified HTML element? element:disabled - Which selector targets every disabled instance of a specified HTML element? element:enabled - Which selector targets every enabled instance of a specified HTML element? element:first-of-type - Which selector targets every instance of a specified HTML element that is the first of its parent? element:last-of-type - Which selector targets every instance of a specified HTML element that is the last of its parent?
element1~element2 - Which selector targets every instance of element2 that is preceded by an instance of element1? background Properties are in this order: background: bg-color bg-image position/bg-size bg-repeat bg- origin bg-clip bg-attachment initial|inherit; - Which property allows you to set different background properties in one declaration? background-clip Key values for this property: border-box - extends behind the border padding-box - extends to the inside edge of the border content-box - extends to the edge of the content box - Which property specifies whether the background extends into the border or not? background-origin Key values for this property: padding-box - from the upper left corner of the padding edge border-box - from the upper left corner of the border content-box - from the upper left corner of the content - Which property positions the background-image relative to an element's border, padding or content? background-size Key values for this property: length - specifies width and height in fixed units percentage - specifies width and height in in relation to the parent element
src — identifies the font file's location by URL - Which two properties are required to specify a custom font? font-stretch - Which property specifies how the font should be stretched or spaced? font-style - Which property specifies how the font should be styled vertical or slanted? font-weight - Which property specifies the weight or thickness of each character in the font? unicode-range - Which property specifies the range of UNICODE characters that should be downloaded for the font, based on availability? hanging-punctuation - 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? punctuation-trim - Which property specifies whether (and how) punctuation characters can be trimmed or sized when they appear at the beginning or end of a line? text-align-last - Which property specifies a justification style for the last line in a text block whose text-align property is set to "justify"? text-emphasis - Which property applies emphasis style and color to an HTML element's text in a single declaration? text-justify - Which property specifies a justification style for text whose text-align property is set to "justify"?
text-wrap - 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? word-break Key values for this property: break-all - word may be broken at any character break-word - word may be broken at arbitrary points - Which property specifies whether lines of text in a text area can break, and where a line can be broken? word-wrap Key values for this property: normal - Break words only at allowed break points break-word - Allows unbreakable words to be broken - Which property specifies that long words in a text area may be broken without a hyphen and wrap to the next line? transform - Which property applies a 2D or 3D transformation to an HTML element, including rotating, moving, skewing, scaling and so forth? transform-origin - Which property allows you to change a transformed HTML element's position? transform-style - Which property specifies whether child elements will retain the parent element's position in 3D space? perspective-origin - Which transform value specifies the bottom position of a 3D element?
transform:skewX(angle) - Which transform value turns or skews the HTML element to a specified angle along its X-axis? transform:skewY(angle) - Which transform value turns or skews the HTML element to a specified angle along its Y-axis? transform:rotateX(angle) - Which transform value rotates the HTML element around its X-axis at the specified degree? transform:rotateY(angle) - Which transform value rotates the HTML element around its Y-axis at the specified degree? transform:rotateZ(angle) - Which transform value rotates the HTML element around its Z-axis at the specified degree? transform:rotate3d(x,y,z,angle) - Which transform value defines a 3D rotation by specifying the degree for rotation for all axes? transform:scale3d(x,y,z) - Which transform value increases or decreases the size of the HTML element, based on specified parameters for width, height and depth? transform:scaleX(x) - Which transform value defines a 3D scale transformation by specifying a value for the X-axis? transform:scaleY(y) - Which transform value defines a 3D scale transformation by specifying a value for the Y-axis? transform:scaleZ(z) - Which transform value defines a 3D scale transformation by specifying a value for the Z-axis? transform:translate3d(x,y,z) - Which transform value defines a 3D translation using specified parameters for positions on the X-axis, Y-axis and Z-axis?
transform:translateX(x) - Which transform value defines a 3D translation using only the value for the X-axis? transform:translateY(y) - Which transform value defines a 3D translation using only the value for the Y-axis? transform:translateZ(z) - Which transform value defines a 3D translation using only the value for the Z-axis? transform:matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n) - Which transform value defines a 3D transformation using a 4x4 matrix of 16 values? transform:perspective(n) - Which transform value defines a perspective view for a 3D transformed element? transition Properties are in this order: transition: property duration timing-function delay|initial|inherit; - Which property specifics the four transition properties into a single property? No transition will occur - If you do not specify the duration for a CSS transition, what happens? transition-property - Which property specifies the CSS property that the transition will affect? transition-duration - Which property defines the amount of time that a transition takes? transition-timing-function - Which property describes the speed of a transition?
animation-delay - Which property specifies when the animation will begin? animation-iteration-count - Which property specifies the number of times that the animation will play? animation-direction - Which property specifies whether to play the animation in reverse on alternate cycles? animation-play-state - Which property specifies whether the animation is running or paused? appearance - Which property makes an HTML element look like a standard user interface element, such as a button or window? box-sizing Key values for this property: content-box - width and height includes only the content border-box - width and height includes content, padding and border - Which property forces specified HTML elements fit an area in a certain way? icon - Which property styles an HTML element with an iconic equivalent? nav-down - Which property specifies where the cursor will navigate to when the user presses the arrow-down key? nav-index - Which property specifies the tabbing order for an HTML element? nav-left - Which property specifies where the cursor will navigate to when the user presses the arrow-left key?
nav-right - Which property specifies where the cursor will navigate to when the user presses the arrow-right key? nav-up - Which property specifies where the cursor will navigate to when the user presses the arrow-up key? outline-offset - Which property draws an outline beyond the border edge as specified? The element will display behind other elements. - What happens when you assign a negative z-index value to an element? z-index - Which property specifies the stack order of an HTML element? declaration - What consists of a property and a value? rule Example: body {background-color: #008080; color: #FFFFFF;} - What is a format instruction that consists of a specified selector and the properties and values applied to it? selector - What is used to "find" the HTML elements you want to style with CSS? property - What is an attribute that can be customized to change the way the element renders in the browser? value - What is a specific selection for a property? class selector - Which selector targets all elements with a specific HTML class attribute assigned?
float - Which property is used for positioning and formatting content to the text in a container? clear - Which property specifies what elements can float beside the cleared element and on which side? static - Which positioning scheme positions an element according to the normal flow of the page? relative - Which positioning scheme positions an element in relationship to its normal position? fixed - 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? absolute - Which positioning scheme positions an element in relationship to the nearest positioned ancestor? padding - Which property defines the transparent area inside of the border? margin - Which property defines the transparent area outside of the border? box model - What model configure the space around each HTML element? vertical-algin - Which property specifies the vertical alignment of an element? formats every
element that is preceded by an
element as red text - What does this rule do?
h3~p {color: red;} Cascading Style Sheets (CSS) - Which W3C technology is used to apply formatting instructions to markup language documents?
