` element is an example of an inline element. `

` is an example of a block element.","answer":false,"code":false},{"text":"A `` is an example of a block element. `

link
list item
list item

","reference":"```","choices":[{"text":"green","answer":false,"code":false},{"text":"yellow","answer":true,"code":false},{"text":"blue","answer":false,"code":false},{"text":"red","answer":false,"code":false}]},{"id":13,"question":"When elements overlap, they are ordered on the z-axis (i.e., which element covers another). The z-index property can be used to specify the z-order of overlapping elements. Which set of statements about the z-index property are true?","code":"","reference":"","choices":[{"text":"Larger z-index values appear on top of elements with a lower z-index value. Negative and positive numbers can be used. z-index can only be used on positioned elements.","answer":true,"code":false},{"text":"Smaller z-index values appear on top of elements with a larger z-index value. Negative and positive numbers can be used. z-index must also be used with positioned elements.","answer":false,"code":false},{"text":"Larger z-index values appear on top of elements with a lower z-index value. Only positive numbers can be used. z-index must also be used with positioned elements.","answer":false,"code":false},{"text":"Smaller z-index values appear on top of elements with a larger z-index value. Negative and positive numbers can be used. z-index can be used with or without positioned elements.","answer":false,"code":false}]},{"id":14,"question":"What is the difference between the following line-height settings?","code":"css line-height: 20px; line-height: 2;","reference":"```","choices":[{"text":"The value of 20px will set the line-height to 20px. The value of 2 will set the line-height to twice the size of the corresponding font-size value.","answer":true,"code":false},{"text":"The value of 20px will set the line-height to 20px. The value of 2 is not valid.","answer":false,"code":false},{"text":"The value of 20px will set the line-height to 20px. The value of 2 will default to a value of 2px.","answer":false,"code":false},{"text":"The value of 20px will set the line-height to 20px. The value of 2 will set the line-height to 20% of the corresponding font-size value.","answer":false,"code":false}]},{"id":15,"question":"In the following example, what color will paragraph one and paragraph two be? (_Alternative_: In this example, what color will paragraphs one and two be?)","code":"html

paragraph one

paragraph two

css section p { color: red; } section + p { color: blue; }","reference":"```","choices":[{"text":"Paragraph one will be blue, paragraph two will be red.","answer":false,"code":false},{"text":"Both paragraphs will be blue.","answer":false,"code":false},{"text":"Paragraphs one will be red, paragraph two will be blue.","answer":true,"code":false},{"text":"Both paragraphs will be red.","answer":false,"code":false}]},{"id":16,"code":"markdown 1. External; CSS is written in a separate file. 2. Inline; CSS is added to the of the HTML page. 3. Internal; CSS is included within the HTML tags. markdown 1. External; CSS is written in a separate file and is linked within the

element of the HTML file. 2. Inline; CSS is added to the HTML tag. 3. Internal; CSS is included within the

element of the HTML file. markdown 1. External; CSS is written in a separate file and is linked within the element of the HTML file. 2. Internal; CSS is included within the

element of the HTML file. 3. Inline; CSS is added to the HTML tag. markdown 1. External; CSS is written in a separate file and is linked within the element of the HTML file. 2. Inline; CSS is added to the HTML tag. 3. Internal; CSS is included within the element of the HTML file.","choices":[{"text":"markdown\n 1. External; CSS is written in a separate file.\n 2. Inline; CSS is added to the of the HTML page.\n 3. Internal; CSS is included within the HTML tags.\n ","code":true,"answer":false},{"text":"markdown\n 1. External; CSS is written in a separate file and is linked within the

element of the HTML file.\n 2. Inline; CSS is added to the HTML tag.\n 3. Internal; CSS is included within the

element of the HTML file.\n ","code":true,"answer":false},{"text":"markdown\n 1. External; CSS is written in a separate file and is linked within the element of the HTML file.\n 2. Internal; CSS is included within the

element of the HTML file.\n 3. Inline; CSS is added to the HTML tag.\n ","code":true,"answer":false},{"text":"markdown\n 1. External; CSS is written in a separate file and is linked within the element of the HTML file.\n 2. Inline; CSS is added to the HTML tag.\n 3. Internal; CSS is included within the element of the HTML file.\n ","code":true,"answer":true}]},{"id":17,"question":"Which of the following is true of the SVG image format? (_Alternative_: Which statement about the SVG image format is true?)","code":"","reference":"","choices":[{"text":"CSS can be applied to SVGs but JavaScript cannot be.","answer":false,"code":false},{"text":"SVGs work best for creating 3D graphics.","answer":false,"code":false},{"text":"SVGs can be created as a vector graphic or coded using SVG specific elements such as <svg>, <line>, and <ellipse>.","answer":true,"code":false},{"text":"SVGs are a HAML-based markup language for creating vector graphics.","answer":false,"code":false}]},{"id":18,"question":"In the example below, when will the color pink be applied to the anchor element?","code":"css a:active { color: pink; }","reference":"```","choices":[{"text":"The color of the link will display as pink after its been clicked or if the mouse is hovering over the link.","answer":false,"code":false},{"text":"The color of the link will display as pink on mouse hover.","answer":false,"code":false},{"text":"The color of the link will display as pink while the link is being clicked but before the mouse click is released.","answer":true,"code":false},{"text":"The color of the link will display as pink before it has been clicked.","answer":false,"code":false}]},{"id":19,"question":"To change the color of an SVG using CSS, which property is used?","code":"","reference":"","choices":[{"text":"Use background-fill to set the color inside the object and stroke or border to set the color of the border.","answer":false,"code":false},{"text":"The color cannot be changed with CSS.","answer":false,"code":false},{"text":"Use fill or background to set the color inside the object and stroke to set the color of the border.","answer":false,"code":false},{"text":"Use fill to set the color inside the object and stroke to set the color of the border.","answer":true,"code":false}]},{"id":20,"question":"When using position: fixed, what will the element always be positioned relative to?","code":"","reference":"","choices":[{"text":"the closest element with position: relative","answer":false,"code":false},{"text":"the viewport","answer":true,"code":false},{"text":"the parent element","answer":false,"code":false},{"text":"the wrapper element","answer":false,"code":false}]},{"id":21,"question":"By default, a background image will repeat _","code":"","reference":"","choices":[{"text":"only if the background-repeat property is set to repeat","answer":false,"code":false},{"text":"indefinitely, vertically, and horizontally","answer":true,"code":false},{"text":"indefinitely on the horizontal axis only","answer":false,"code":false},{"text":"once, on the x and y axis","answer":false,"code":false}]},{"id":22,"question":"When using media queries, media types are used to target a device category. Which choice lists current valid media types?","code":"","reference":"","choices":[{"text":"print, screen, aural","answer":false,"code":false},{"text":"print, screen, television","answer":false,"code":false},{"text":"print, screen, speech","answer":true,"code":false},{"text":"print, speech, device","answer":false,"code":false}]},{"id":23,"question":"How would you make the first letter of every paragraph on the page red?","code":"","reference":"","choices":[{"text":"p::first-letter { color: red; }","answer":true,"code":false},{"text":"p:first-letter { color: red; }","answer":false,"code":false},{"text":"first-letter::p { color: red; }","answer":false,"code":false},{"text":"first-letter:p { color: red; }","answer":false,"code":false}]},{"id":24,"question":"In this example, what is the selector, property, and value?","code":"css p { color: #000000; } markdown \"p\" is the selector \"#000000\" is the property \"color\" is the value markdown \"p\" is the selector \"color\" is the property \"#000000\" is the value markdown \"color\" is the selector \"#000000\" is the property \"#p\" is the value markdown \"color\" is the selector \"p\" is the property \"#000000\" is the value","choices":[{"text":"markdown\n \"p\" is the selector\n \"#000000\" is the property\n \"color\" is the value\n ","code":true,"answer":false},{"text":"markdown\n \"p\" is the selector\n \"color\" is the property\n \"#000000\" is the value\n ","code":true,"answer":true},{"text":"markdown\n \"color\" is the selector\n \"#000000\" is the property\n \"#p\" is the value\n ","code":true,"answer":false},{"text":"markdown\n \"color\" is the selector\n \"p\" is the property\n \"#000000\" is the value\n ","code":true,"answer":false}]},{"id":25,"question":"What is the rem unit based on?","code":"","reference":"","choices":[{"text":"The rem unit is relative to the font-size of the p element.","answer":false,"code":false},{"text":"You have to set the value for the rem unit by writing a declaration such as rem { font-size: 1 Spx; }","answer":false,"code":false},{"text":"The rem unit is relative to the font-size of the containing (parent) element.","answer":false,"code":false},{"text":"The rem unit is relative to the font-size of the root element of the page.","answer":true,"code":false}]},{"id":26,"code":"","reference":"","choices":[{"text":"corner-curve: 10px","answer":false,"code":false},{"text":"border-corner: 10px","answer":false,"code":false},{"text":"border-radius: 10px","answer":true,"code":false},{"text":"corner-radius: 10px","answer":false,"code":false}]},{"id":27,"question":"In the following media query example, what conditions are being targeted?","code":"css @media (min-width: 1024px), screen and (orientation: landscape) { … }","reference":"```","choices":[{"text":"The rule will apply to a device that has either a width of 1024px or wider, or is a screen device in landscape mode.","answer":true,"code":false},{"text":"The rule will apply to a device that has a width of 1024px or narrower and is a screen device in landscape mode.","answer":false,"code":false},{"text":"The rule will apply to a device that has a width of 1024px or wider and is a screen device in landscape mode.","answer":false,"code":false},{"text":"The rule will apply to a device that has a width of 1024px or narrower, or is a screen device in landscape mode.","answer":false,"code":false}]},{"id":28,"question":"CSS transform properties are used to change the shape and position of the selected objects. The transform-origin property specifies the location of the element's transformation origin. By default, what is the location of the origin?","code":"","reference":"","choices":[{"text":"the top left corner of the element","answer":true,"code":false},{"text":"the center of the element","answer":false,"code":false},{"text":"the top right corner of the element","answer":false,"code":false},{"text":"the bottom left of the element","answer":false,"code":false}]},{"id":29,"question":"Which of the following is not a valid color value? (_Alternative:_ Which choice is not a valid color value?)","code":"","reference":"","choices":[{"text":"`color: #000`","answer":false,"code":false},{"text":"`color: rgb(0,0,0)`","answer":false,"code":false},{"text":"`color: #000000`","answer":false,"code":false},{"text":"`color: 000000`","answer":true,"code":false}]},{"id":30,"question":"What is the vertical gap between the two elements below?","code":"html

Div 1

Div 2

","reference":"```","choices":[{"text":"2rem","answer":true,"code":false},{"text":"32px","answer":false,"code":false},{"text":"64px","answer":false,"code":false},{"text":"4rem","answer":false,"code":false}]},{"id":31,"question":"When using the Flexbox method, what property and value is used to display flex items in a column?","code":"","reference":"","choices":[{"text":"flex-flow: column; or flex-direction: column","answer":true,"code":false},{"text":"flex-flow: column;","answer":false,"code":false},{"text":"flex-column: auto;","answer":false,"code":false},{"text":"flex-direction: column;","answer":false,"code":false}]},{"id":32,"question":"Which type of declaration will take precedence?","code":"","reference":"","choices":[{"text":"any declarations in user-agent stylesheets","answer":false,"code":false},{"text":"important declarations in user stylesheets","answer":true,"code":false},{"text":"normal declarations in author stylesheets","answer":false,"code":false},{"text":"important declarations in author stylesheets","answer":false,"code":false}]},{"id":33,"question":"The flex-direction property is used to specify the direction that flex items are displayed. What are the values used to specify the direction of the items in the following examples?","code":"![quote](https://raw.githubusercontent.com/ram-sah/LinkedIn-Assessments/master/CSS/images/rm-1.png) - Example 1: `flex-direction: row;` - Example 2: `flex-direction: row-reverse;` - Example 3: `flex-direction: column;` - Example 4: `flex-direction: column-reverse;` - Example 1: `flex-direction: row-reverse;` - Example 2: `flex-direction: row;` - Example 3: `flex-direction: column-reverse;` - Example 4: `flex-direction: column;` - Example 1: `flex-direction: row;` - Example 2: `flex-direction: row-reverse;` - Example 3: `flex-direction: column;` - Example 4: `flex-direction: reverse-column;` - Example 1: `flex-direction: column;` - Example 2: `flex-direction: column-reverse;` - Example 3: `flex-direction: row;` - Example 4: `flex-direction: row-reverse;` Note: Examples seem to be missing.","choices":[{"code":true,"answer":true},{"code":true,"answer":false},{"code":true,"answer":false},{"code":true,"answer":false}]},{"id":34,"question":"There are two sibling combinators that can be used to select elements contained within the same parent element; the general sibling combinator (~) and the adjacent sibling combinator (+). Referring to example below, which elements will the styles be applied to?","code":"css h2 ~ p { color: blue; } h2 + p { background: beige; } html

paragraph 1

Heading

paragraph 2

paragraph 3

","reference":"```","choices":[{"text":"Paragraphs 2 and 3 will be blue. The h2 and paragraph 2 will have a beige background.","answer":false,"code":false},{"text":"Paragraphs 2, and 3 will be blue, and paragraph 2 will have a beige background.","answer":true,"code":false},{"text":"Paragraph 2 will be blue. Paragraphs 2 and 3 will have a beige background.","answer":false,"code":false}]},{"id":35,"question":"When using flexbox, the \"justify-content\" property can be used to distribute the space between the flex items along the main axis. Which value should be used to evenly distribute the flex items within the container shown below?","code":"![quote](https://raw.githubusercontent.com/ram-sah/LinkedIn-Assessments/master/CSS/images/rm-2.png)","reference":"![quote](https://raw.githubusercontent.com/ram-sah/LinkedIn-Assessments/master/CSS/images/rm-2.png)","choices":[{"text":"justify-content: space-around;","answer":true,"code":false},{"text":"justify-content: center;","answer":false,"code":false},{"text":"justify-content: auto;","answer":false,"code":false},{"text":"justify-content: space-between;","answer":false,"code":false}]},{"id":36,"question":"There are many advantages to using icon fonts. What is one of those advantages?","code":"","reference":"","choices":[{"text":"Icon fonts increase accessibility.","answer":false,"code":false},{"text":"Icon fonts can be used to replace custom fonts.","answer":false,"code":false},{"text":"Icon fonts can be styled with typography related properties such as font-size and color.","answer":true,"code":false},{"text":"Icon fonts are also web safe fonts.","answer":false,"code":false}]},{"id":37,"question":"What is the difference between `display:none` and `visibility:hidden`?","code":"","reference":"","choices":[{"text":"Both will hide the element on the page, but display:none has greater browser support. visibility:hidden is a new property and does not have the best browser support","answer":false,"code":false},{"text":"display:none hides the elements but maintains the space it previously occupied. visibility:hidden will hide the element from view and remove it from the normal flow of the document","answer":false,"code":false},{"text":"display:none hides the element from view and removes it from the normal flow of the document. visibility:hidden will hide the element but maintains the space it previously occupied.","answer":true,"code":false},{"text":"There is no difference; both will hide the element on the page","answer":false,"code":false}]},{"id":38,"question":"What selector and property would you use to scale an element to be 50% smaller on hover?","code":"","reference":"","choices":[{"text":"element:hover {scale: 0.5;}","answer":false,"code":false},{"text":"element:hover {transform: scale(0.5);}","answer":true,"code":false},{"text":"element:hover {scale: 50%;}","answer":false,"code":false},{"text":"element:hover {transform: scale(50%);}","answer":false,"code":false}]},{"id":39,"question":"Which statement regarding icon fonts is true?","code":"","reference":"","choices":[{"text":"Icon fonts can be inserted only using JavaScript.","answer":false,"code":false},{"text":"Icon fonts are inserted as inline images.","answer":false,"code":false},{"text":"Icon fonts require browser extensions.","answer":false,"code":false},{"text":"Icon fonts can be styled with typography-related properties such as font-size and color.","answer":true,"code":false}]},{"id":40,"question":"The values for the font-weight property can be keywords or numbers. For each numbered value below, what is the associated keyword?","code":"css font-weight: 400; font-weight: 700;","reference":"```","choices":[{"text":"bold; normal","answer":false,"code":false},{"text":"normal; bold","answer":true,"code":false},{"text":"light; normal","answer":false,"code":false},{"text":"normal; bolder","answer":false,"code":false}]},{"id":41,"question":"If the width of the container is 500 pixels, what would the width of the three columns be in this layout?","code":"`.grid { display: grid; grid-template-columns: 50px 1fr 2fr; }` Note: an alternative for Q7.","reference":"Note: an alternative for Q7.","choices":[{"text":"50px, 150px, 300px","answer":true,"code":false},{"text":"50px, 200px, 300px","answer":false,"code":false},{"text":"50px, 100px, 200px","answer":false,"code":false},{"text":"50px, 50px, 100px","answer":false,"code":false}]},{"id":42,"question":"Using the :nth-child pseudo class, what would be the most efficient way to style every third item in a list, no matter how many items are present, starting with item 2?","code":"css li:nth-child(3 + 2n) { margin: 0 5 px; } css li:nth-child(3n + 2) { margin: 0 5 px; } css li:nth-child(2), li:nth-child(5), li:nth-child(8) { margin: 0 5 px; } css li:nth-child(2n + 3) { margin: 0 5 px; }","choices":[{"text":"css\n li:nth-child(3 + 2n) {\n margin: 0 5 px;\n }\n ","code":true,"answer":false},{"text":"css\n li:nth-child(3n + 2) {\n margin: 0 5 px;\n }\n ","code":true,"answer":true},{"text":"css\n li:nth-child(2),\n li:nth-child(5),\n li:nth-child(8) {\n margin: 0 5 px;\n }\n ","code":true,"answer":false},{"text":"css\n li:nth-child(2n + 3) {\n margin: 0 5 px;\n }\n ","code":true,"answer":false}]},{"id":43,"question":"Which selector would select only internal links within the current page?","code":"","reference":"","choices":[{"text":"`a[href=\"#\"","answer":false,"code":false},{"text":"`a[href~=\"#\"]`","answer":false,"code":false},{"text":"`a[href^=\"#\"]`","answer":false,"code":false},{"text":"`a[href=\"#\"]`","answer":true,"code":false}]},{"id":44,"question":"What is not true about class selectors?","code":"","reference":"","choices":[{"text":"Only one class value can be assigned to an element.","answer":true,"code":false},{"text":"An element can have multiple class value.","answer":false,"code":false},{"text":"Class selectors are marked with a leading period.","answer":false,"code":false},{"text":"More than one element can have the same class value.","answer":false,"code":false}]},{"id":45,"question":"What is the difference between the margin and padding properties?","code":"","reference":"","choices":[{"text":"Margin adds space around and inside of an element; padding adds space only inside of an element.","answer":false,"code":false},{"text":"Margin adds space around an element; padding adds space inside of an element.","answer":true,"code":false},{"text":"Margin adds a line around an element, padding adds space inside of an element.","answer":false,"code":false},{"text":"Margin adds space inside of an element, padding adds space around an element.","answer":false,"code":false}]},{"id":46,"question":"What is not a valid way of declaring a padding value of 10 pixels on the top and bottom, and 0 pixels on the left and right?","code":"","reference":"","choices":[{"text":"padding: 10px 10px 0px 0px;","answer":true,"code":false},{"text":"padding: 10px 0px;","answer":false,"code":false},{"text":"padding: 10px 0;","answer":false,"code":false},{"text":"padding: 10px 0px 10px 0px;","answer":false,"code":false}]},{"id":47,"question":"Is there an error in this code? If so, find the best description of the problem","code":"css @font-face { font-family: 'Avenir', sans-serif; src: url('avenir.woff2') format('woff2'), url('avenir.woff') format('woff'); }","reference":"```","choices":[{"text":"The font file formats are not supported in modern browsers.","answer":false,"code":false},{"text":"The src attribute requires a comma between the URL and format values.","answer":false,"code":false},{"text":"There are no errors in the example.","answer":false,"code":false},{"text":"The sans-serif inclusion is problematic.","answer":true,"code":false}]},{"id":48,"question":"Which style places an element at a fixed location within its container?","code":"","reference":"","choices":[{"text":"position: absolute;","answer":true,"code":false},{"text":"display: flex;","answer":false,"code":false},{"text":"display: block;","answer":false,"code":false},{"text":"float: left;","answer":false,"code":false}]},{"id":49,"question":"The calc() CSS function is often used for calculating relative values. In the example below, what is the specified margin-left value?","code":"css .example { margin-left: calc(5% + 5px); }","reference":"```","choices":[{"text":"The left margin value is equal to 5% of its parents element's width plus 5px","answer":true,"code":false},{"text":"The left margin value is equal to 5% of the viewport width plus 5px","answer":false,"code":false},{"text":"The left margin value is equal to 5% of the closest positioned element's width plus 5px","answer":false,"code":false},{"text":"The left margin value is equal to 5% of the selected element's width (.example) plus 5px","answer":false,"code":false}]},{"id":50,"question":"What is the CSS selector for an `` tag containing the title attribute?","code":"Note: an alternative for Q2.","reference":"Note: an alternative for Q2.","choices":[{"text":"`a[title]`","answer":true,"code":false},{"text":"`a > title`","answer":false,"code":false},{"text":"`a=title`","answer":false,"code":false},{"text":"`a.title`","answer":false,"code":false}]},{"id":51,"question":"Which code would you use to absolutely position an element of the logo class?","code":"","reference":"","choices":[{"text":"`.logo { position: absolute; left: 100px; top: 150px; }`","answer":true,"code":false},{"text":"`.logo { position: absolute; margin-left: 100px; margin-top: 150px; }`","answer":false,"code":false},{"text":"`.logo { position: absolute; padding-left: 100px; padding-top: 150px; }`","answer":false,"code":false},{"text":"`.logo { position: absolute; left-padding: 100px; top-padding: 150px; }`","answer":false,"code":false}]},{"id":52,"question":"In this example, what color will Paragraph 1 be?","code":"css p:first-of-type { color: red; } p { color: blue; } .container { color: yellow; } p:first-child { color: green; } html

Heading

Paragraph1

Paragraph2

, from lowest to highest specificity.","code":"html

...

` element?","code":"html

Heading 1

Heading 2

Paragraph 1

","reference":"```","choices":[{"text":"Paragraph 1 will be blue. Paragraph 2 will be green.","answer":false,"code":false},{"text":"Both paragraphs will be green.","answer":false,"code":false},{"text":"Paragraph 1 will be green. Paragraph 2 will be blue.","answer":true,"code":false},{"text":"Both paragraphs will be blue.","answer":false,"code":false}]},{"id":93,"question":"Review the declaration of border style shown below. What is the corresponding longhand syntax?","code":"css border: 1px solid red; css border-size: 1px; border-style: solid; border-color: red; css border-size: 1px; border-type: solid; border-color: red; css border-width: 1px; border-style: solid; border-color: red; css border-width: 1px; border-line: solid; border-color: red;","choices":[{"text":"css\n border-size: 1px;\n border-style: solid;\n border-color: red;\n ","code":true,"answer":false},{"text":"css\n border-size: 1px;\n border-type: solid;\n border-color: red;\n ","code":true,"answer":false},{"text":"css\n border-width: 1px;\n border-style: solid;\n border-color: red;\n ","code":true,"answer":true},{"text":"css\n border-width: 1px;\n border-line: solid;\n border-color: red;\n ","code":true,"answer":false}]},{"id":94,"question":"Pseudo-classes are used to `_`.","code":"","reference":"","choices":[{"text":"style the state of the selected element","answer":true,"code":false},{"text":"insert presentational content","answer":false,"code":false},{"text":"style a specific part of the selected element","answer":false,"code":false},{"text":"style the elements using class selectors","answer":false,"code":false}]},{"id":95,"question":"In this example, what styles will be applied to which elements?","code":"css section { color: gray; } html

paragraph

link

","reference":"```","choices":[{"text":"The paragraph and link will be gray.","answer":false,"code":false},{"text":"The background color of the section element will be gray.","answer":false,"code":false},{"text":"The paragraph will be gray. The link will be the browser default, black.","answer":false,"code":false},{"text":"Only the paragraph will be gray.","answer":true,"code":false}]},{"id":96,"question":"Which answer is an example of a type selector (also sometimes referred to as an element selector)?","code":"","reference":"","choices":[{"text":"`.header {...}`","answer":false,"code":false},{"text":"`header {...}`","answer":true,"code":false},{"text":"`#header {...}`","answer":false,"code":false},{"text":"`header > h1 {...}`","answer":false,"code":false}]},{"id":97,"question":"What is the correct order for listing different link states in a website so those states display correctly on the page?","code":"css a a:hover css :link :visited :hover :active :focus css :active :focus :hover :link :visited css :link :visited :focus :hover :active","choices":[{"text":"css\n a\n a:hover\n ","code":true,"answer":false},{"text":"css\n :link\n :visited\n :hover\n :active\n :focus\n ","code":true,"answer":false},{"text":"css\n :active\n :focus\n :hover\n :link\n :visited\n ","code":true,"answer":false},{"text":"css\n :link\n :visited\n :focus\n :hover\n :active\n ","code":true,"answer":true}]},{"id":98,"question":"Which selector is used to select the paragraph element that is a direct descendent of section?","code":"","reference":"","choices":[{"text":"`section * p`","answer":false,"code":false},{"text":"`section + p`","answer":false,"code":false},{"text":"`section ~ p`","answer":false,"code":false},{"text":"`section > p`","answer":true,"code":false}]},{"id":99,"question":"For this code, what is the font color of the hypertext link?","code":"css ul { --color: red; } p { color: var(--color); } a { color: var(--color, orange); } html

Paragraph

list item a link
list item

","reference":"```","choices":[{"text":"red","answer":true,"code":false},{"text":"orange","answer":false,"code":false},{"text":"blue","answer":false,"code":false},{"text":"black","answer":false,"code":false}]},{"id":100,"question":"Which statement is not true?","code":"","reference":"","choices":[{"text":"Specificity determines which CSS rule is applied by the browsers.","answer":false,"code":false},{"text":"When two selectors apply to the same element, the one with lower specificity wins.","answer":true,"code":false},{"text":"The last rule defined overrides all previous rules and even conflicting rules.","answer":false,"code":false},{"text":"Rules with more specific selectors have greater specificity.","answer":false,"code":false}]},{"id":101,"question":"What is the output of the margin value when used within this context, assuming that its containing element is larger than 800px?","code":"css .example { width: 800px; margin: 0 auto; }","reference":"```","choices":[{"text":"The example element will have 0 margin space around the whole element. The auto value will center align the element horizontally and vertically within its container.","answer":false,"code":false},{"text":"The example element will have 0 margin space on the left and right. It will be sized automatically on the top and bottom, which will center align the element within its container.","answer":false,"code":false},{"text":"The example element will have 0 margin space on the top and bottom. The margin will be sized automatically on the left and right, which may center align the element within its container.","answer":true,"code":false},{"text":"The margin value is invalid because its missing a unit measurement after the 0.","answer":false,"code":false}]},{"id":102,"question":"There are currently four viewport-percentage lengths that can be used to define the value relative to the viewport size: vw, vh, vmin, and vmax. If the current viewport size has a width of 800px and a height of 600px, what will these values be equivalent to in pixels?","code":"css 10vw = ?px 10vh = ?px 10vmin = ?px 10vmax = ?px 10vh = 60px 10vmin = 60px 10vmax = 80px 10vh = 80px 10vmin = 80px 10vmax = 60px 10vh = 6px 10vmin = 6px 10vmax = 8px 10vh = 8px 10vmin = 8px 10vmax = 6px","reference":" 10vmax = 6px","choices":[{"text":"10vw = 80px","answer":true,"code":false},{"text":"10vw = 60px","answer":false,"code":false},{"text":"10vw = 8px","answer":false,"code":false},{"text":"10vw = 6px","answer":false,"code":false}]},{"id":103,"question":"Which element(s) will be blue?","code":"css h2 ~ p { color: blue; } html

H2

### Q104. Referring to the HTML markup and CSS example below, which element(s) will be targeted? css p:first-of-type:first-letter { color: red; } html

Paragraph 1.

Paragraph 2.

Heading

Paragraph 3.

paragraph 4.

Paragraph 5.

Paragraph 6.

","reference":"```","choices":[{"text":"P3P3","answer":false,"code":false},{"text":"P1P1","answer":false,"code":false},{"text":"P1, P3, and P4P1, P3, and P4","answer":false,"code":false},{"text":"P3 and P4","answer":true,"code":false},{"text":"The first letter in all paragraphs will be red.","answer":false,"code":false},{"text":"Only the first letter in paragraphs 1 and 5 will be red.","answer":false,"code":false},{"text":"The first letter in paragraphs 1, 3, and 5 will be red.","answer":true,"code":false},{"text":"Only the first letter in paragraph 1 will be red.Only","answer":false,"code":false}]},{"id":104,"code":"","reference":"","choices":[{"text":"margin, padding, border, width, height","answer":true,"code":false},{"text":"width, height, z-index, overflow, font size","answer":false,"code":false},{"text":"margin, padding, font size, line height, border","answer":false,"code":false},{"text":"font size, line height, letter spacing, width, height","answer":false,"code":false}]},{"id":105,"code":"css color: pink; } color: pink; } color: rgb(255, 155, 155); } color: pink; }","reference":"```","choices":[]},{"id":106,"code":"css ### Q108. You want to add a background circle behind an icon. Which style declaration is correct? css circle-radius: 50%; margins: 50px; background-color: #fdadc6; color: rgba(255, 255, 255, 1); font-size: 24px; } border-circle: 50%; padding: 50px; background-color: #fdadc6; color: rgba(255, 255, 255, 1); font-size: 24px; } border-radius: 50%; padding: 50px; background-color: #fdadc6; color: rgba(255, 255, 255, 1); font-size: 24px; } radius-rounded: 50%; margins: auto; background-color: #fdadc6; color: rgba(255, 255, 255, 1); font-size: 24px; }","reference":"```","choices":[]},{"id":107,"code":"### Q110. Which items are valid values for the font-size property? css A. font-size: xsmall B. font-size: 50% C. font-size: 1em D. font-size: 20px","reference":"```","choices":[{"text":"The first value is the first choice, followed by alternative options, ordered by preference. The last option should be a generic font.","answer":true,"code":false},{"text":"The first value is the first choice. The order of the alternative options does not matter. It depends on what is available on the user's computer.","answer":false,"code":false},{"text":"The first value is the first choice, and must be followed by at least one alternative option before adding the generic font.","answer":false,"code":false},{"text":"The first value is the first choice, followed by a maximum of three alternatives.","answer":false,"code":false},{"text":"C, D","answer":false,"code":false},{"text":"B, C, D","answer":true,"code":false},{"text":"A, C","answer":false,"code":false},{"text":"A, B, C, D","answer":false,"code":false}]},{"id":108,"code":"![Sample text](https://raw.githubusercontent.com/ram-sah/LinkedIn-Assessments/master/CSS/images/rm-3.png)","reference":"![Sample text](https://raw.githubusercontent.com/ram-sah/LinkedIn-Assessments/master/CSS/images/rm-3.png)","choices":[{"text":"Floating the blue box increased its height.","answer":false,"code":false},{"text":"Floating the blue box on the left also moves it down.","answer":false,"code":false},{"text":"Floating the blue box actually shifts it to the right and down.","answer":false,"code":false},{"text":"Floating the blue box took it out of document flow and the container is sized only to the sample text.","answer":true,"code":false}]},{"id":109,"code":"css

css .overlay { position: static; top: 200px; bottom: 200px; right: 200px; left: 200px; background-color: rgba(0, 0, 0, 0.5); } css .overlay { position: absolute; top: 200px; bottom: 200px; right: 200px; left: 200px; background-color: rgba(0, 0, 0, 0.5); } css .overlay { position: static; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); } css .overlay { position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); }","choices":[{"text":"css\n.overlay {\n position: static;\n top: 200px;\n bottom: 200px;\n right: 200px;\n left: 200px;\n background-color: rgba(0, 0, 0, 0.5);\n}\n","code":true,"answer":false},{"text":"css\n.overlay {\n position: absolute;\n top: 200px;\n bottom: 200px;\n right: 200px;\n left: 200px;\n background-color: rgba(0, 0, 0, 0.5);\n}\n","code":true,"answer":false},{"text":"css\n.overlay {\n position: static;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n background-color: rgba(0, 0, 0, 0.5);\n}\n","code":true,"answer":false},{"text":"css\n.overlay {\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n background-color: rgba(0, 0, 0, 0.5);\n}\n","code":true,"answer":false}]},{"id":110,"code":"js

The z-index property is cool!

css img { position: absolute; left: 0px; top: 0px; // Missing line } js

The z-index property is cool!

css img { position: absolute; left: 0px; top: 0px; // Missing line }","reference":"```","choices":[{"text":"`z-index: 1;z-index: 1;`","answer":false,"code":false},{"text":"`z-index: -1;z-index: -1;`","answer":false,"code":false},{"text":"`z-index: 0;z-index: 0;`","answer":false,"code":false},{"text":"`z-index: true;z-index: true;`","answer":false,"code":false}]},{"id":111,"code":"","reference":"","choices":[{"text":"`font-size: reduce;`","answer":false,"code":false},{"text":"`font-size: 8px;`","answer":false,"code":false},{"text":"`font-size: -1em;`","answer":false,"code":false},{"text":"`font-size: smaller;`","answer":true,"code":false}]},{"id":112,"code":"js #BLM css .highlight { background-color: yellow; } css #highlight { background-color: yellow; } css .highlight { color: yellow; } css #highlight { color: yellow; }","choices":[{"text":"css\n.highlight {\n background-color: yellow;\n}\n","code":true,"answer":false},{"text":"css\n#highlight {\n background-color: yellow;\n}\n","code":true,"answer":false},{"text":"css\n.highlight {\n color: yellow;\n}\n","code":true,"answer":true},{"text":"css\n#highlight {\n color: yellow;\n}\n","code":true,"answer":false}]},{"id":113,"code":"css background-repeat: no-repeat; css background-repeat: fixed; css background-repeat: none; css background-tile: none;","choices":[{"text":"css\nbackground-repeat: no-repeat;\n","code":true,"answer":false},{"text":"css\nbackground-repeat: fixed;\n","code":true,"answer":false},{"text":"css\nbackground-repeat: none;\n","code":true,"answer":false},{"text":"css\nbackground-tile: none;\n","code":true,"answer":false}]},{"id":114,"code":"","reference":"","choices":[{"text":"`transform: rotate(-30deg);`","answer":true,"code":false},{"text":"`transform: rotate(30deg);`","answer":false,"code":false},{"text":"`rotate: 30deg;`","answer":false,"code":false},{"text":"`spin: 30deg;`","answer":false,"code":false}]},{"id":115,"code":"","reference":"","choices":[{"text":"`background-image: file(wood.png);`","answer":false,"code":false},{"text":"`background-image: url(wood.png);`","answer":true,"code":false},{"text":"`background-image: wood.png;`","answer":false,"code":false},{"text":"`image: wood.png`","answer":false,"code":false}]},{"id":116,"code":"js

paragraph one

paragraph two

css section > p { color: blue; } css p { color: blue; } css section + p { color: blue; } css p + section { color: blue; }","choices":[{"text":"css\nsection > p {\n color: blue;\n}\n","code":true,"answer":false},{"text":"css\np {\n color: blue;\n}\n","code":true,"answer":false},{"text":"css\nsection + p {\n color: blue;\n}\n","code":true,"answer":false},{"text":"css\np + section {\n color: blue;\n}\n","code":true,"answer":false}]},{"id":117,"code":"","reference":"","choices":[{"text":"`transform: translateX(-100px)`","answer":false,"code":false},{"text":"`transform: translateY(-100px)`","answer":true,"code":false},{"text":"`transform: translateY(100px)`","answer":false,"code":false},{"text":"`transform: translateX(100px)`","answer":false,"code":false}]},{"id":118,"code":"js

Center Me!

css #inner { width: 50%; } #outer { width: 100%; } css #inner { left: 0; right: 0; position: center; } css #inner { text-align: center; } css #inner { width: 50%; margin: 0 auto; }","choices":[{"text":"css\n#inner {\n width: 50%;\n}\n\n#outer {\n width: 100%;\n}\n","code":true,"answer":false},{"text":"css\n#inner {\n left: 0;\n right: 0;\n position: center;\n}\n","code":true,"answer":false},{"text":"css\n#inner {\n text-align: center;\n}\n","code":true,"answer":false},{"text":"css\n#inner {\n width: 50%;\n margin: 0 auto;\n}\n","code":true,"answer":true}]},{"id":119,"code":"css .pen { height: 100px; width: 100px; border: 2px dashed brown; position: relative; } #puppy { position: absolute; right: 80px; bottom: 0px; } html

🐶

","reference":"```","choices":[{"text":"top-right corner","answer":false,"code":false},{"text":"bottom-right corner","answer":false,"code":false},{"text":"top-left corner","answer":false,"code":false},{"text":"bottom-left corner","answer":true,"code":false}]}]

0/119

In the following example, which selector has the highest specificity ranking for selecting the anchor link element?