google.com, pub-8658045329707802, DIRECT, f08c47fec0942fa0
Upwork Test Answers: Get all the correct answers of most recent and possible Upwork Tests A to Z (Updated on Jan, 2016)
Cover Letter Templates: These cover letter samples are not only for Upwork job, but also you will have some idea about your real life job
 
Freelance Profile Overviews: Different Profile samples and overviews of experts, advanced and intermediate level freelancers
For Newbie of Upwork: Upwork Help - How to apply for a job in Upwork with 10 most important articles about Upwork

A to Z View - All Upwork Test Answers

Showing posts with label CSS Test 2019. Show all posts
Showing posts with label CSS Test 2019. Show all posts

CSS Test Answer 2019


1. Consider the following code snippet:
<div id=»sectors»>
<div id=»A» class=»A»></div>
<div id=»B» class=»B»></div>
<div id=»C» class=»C»></div>
<div id=»D» class=»D»></div>
<div id=»E» class=»E»></div>
</div>
With these style rules:
<style>
#sectors > div {
float: left;
position: relative;
width: 80px;
height: 80px;
margin: 16px;
background-color:red; color: white;
text-align: center;
}
#sectors > div::after {
content: attr(id) ‘-Block’;
}
#sectors > div.changecolor {
background-color: blue;
}
</style>
Which of the following code snippets when inserted into CSS will change the A and B div’s color from red to blue?
Answers:
• In style rule add this code “#sectors > div:not(.C):not(.D):not(.E) {background-color: blue;}”
• In style rule add this code “#sectors > div:not(.C, .D, .E) {background-color: blue;}”
• Both A and B
• None of the above

2. Which of the following will create a triangle effect using pure CSS3 on a white background, without making use of background images?
Answers:
• It is not possible to do so.
• border-color: #a0c7ff #ffffff #ffffff #ffffff; border-style: solid; border-width: 20px; width: 0px; height: 0px;
• background-color: #a0c7ff #ffffff #ffffff #ffffff; border-style: solid; border-width: 20px; width: 0px; height: 0px;
• background-color: #a0c7ff #ffffff #ffffff #ffffff; border-style: solid; border-width: 1px; width: 10px; height: 10px;

3. Consider the following font definition:
font-weight:normal
What is the other way of getting the same result?
Answers:
• font-weight:100
• font-weight:900
• font-weight:400
• font-weight:700

4. Can a percentage value be given in a ruby-align property?
Answers:
• Yes
• No

5. Which of the following is not a valid page break?
Answers:
• page-break-inside
• page-break-outside
• page-break-before
• page-break-after
• None of these

6. Which statement is correct given the following?
box-shadow:30px 20px 10px 5px black;
Answers:
• The shadow will be spread out to 30px top, 20px right, 10px bottom, 5px left.
• The position of the horizontal black shadow is 30px and the position of the vertical black shadow is 20px and blur distance is 10px and size of shadow is 5px.
• The position of the vertical black shadow is 30px and the position of the horizontal black shadow is 20px and size of shadow is 10px and blur distance is 5px.
• The shadow will be spread out to 30px top and bottom, 20px left and right with 10px blur distance, 5px shadow size.

7. Consider the following code:
div[class^=»stronger»] { }
{em
}
Which of the following statements is true?
Answers:
• It applies the rule only on divs who belong to a class that begins with «stronger».
• It applies the rule only on divs of class «stronger».
• It applies the rule only on divs who belong to a class which end with «stronger».
• It applies the rule only on divs who belong to a class which does not contain «stronger» in its name.

8. For the clear property, which of the following values is not valid?
Answers:
• none
• left
• right
• top

9. The min-width property cannot be applied to the following element:
Answers:
• button
• span
• table row

10. Given the following problem:
A drop shadow needs to appear only at the bottom, and no images should be used.
Consider the following code:
-moz-box-shadow: 0px 4px 4px #000;
-webkit-box-shadow: 0px 4px 4px #000;
box-shadow-bottom: 5px #000;
However, this produces shadows on the rest of the element.
Which of the following code snippets will correct the issue?
Answers:
• border-bottom:5px solid #ffffff; -webkit-box-shadow: 0px 5px #000000; -moz-box-shadow: 0px 5px #000000; box-shadow: 0px 5px #000000;
• -webkit-box-shadow: 0 4px 4px -2px #000000; -moz-box-shadow: 0 4px 4px -2px #000000; box-shadow: 0 4px 4px -2px #000000;
• -webkit-box-shadow: 0 4px 4px -2px inside #000000; -moz-box-shadow: 0 4px 4px -2px inside #000000; box-shadow: 0 4px 4px -2px inside #000000;
• None of these.

 11. What will be the output of the following code?
<style>
.foo {
width:100px;
height:50px;
border-width:3px;
-webkit-border-image:
-webkit-gradient(linear, 0 0, 0 100%, from(black), to(red)) 1 100%;
-webkit-border-image:
-webkit-linear-gradient(black, red) 1 100%;
-o-border-image:
-o-linear-gradient(black, red)) 1 100%;
-moz-border-image:
-moz-linear-gradient(black, red) 1 100%;
}
</style>
<div class=»foo»>Lorem</div>
Answers:
• The text «Lorem» will be colored black-red.
• The div element will be colored black-red.
• The border of div element will be colored black-red.
• None of these.

12. Which of the following is not a valid value for the font-smooth property?
Answers:
• auto
• never
• always
• normal
• length

13. Which of the following option does not exist in media groups available in CSS3?
Answers:
• continuous or paged
• visual or tactile
• grid or bitmap
• braille or screen

14. Consider the following code:
body { text-replace: «a» «b» «b» «c» }
What will be the output of the following string if the text-replace style is implemented?
andy lives behind cafe
Answers:
• ndy lives behind cbfe
• cndy lives cehind ccfe
• andy lives behind cafe
• andy lives cehind bafe

15. What is the default value of the transform-style property?
Answers:
• preserve-3d
• flat
• none
• preserve

16. Which of the following will apply a black inner glow with 25% opacity to a page element?
Answers:
• box-shadow: 0 0 8px rgba(255,255,255, 0.25);
• box-shadow: inset 0 0 8px rgba(0,0,0, 0.25);
• box-shadow: 0 0 8px rgba(255,255,255, 25%);
• box-shadow: inset 0 0 8px rgba(0,0,0, 25%);

17. Which of the following is the initial value for the column-fill property?
Answers:
• auto
• balance
• none

18. Which of the following can be used to add a shadow around the div element below?
<div>Lorem ipsum</div>
Answers:
• box-shadow: 0 0 8px 2px #888;
• border-shadow: 0 0 8px 2px #888;
• div-shadow: 8px 2px 0 0 #888;
• None of these

19. What will be the output of the following code?
<style>
.foo {
width:100px;
height:50px;
border-width:3px;
-webkit-border-image:
-webkit-gradient(linear, 0 0, 0 100%, from(black), to(red)) 1 100%;
-webkit-border-image:
-webkit-linear-gradient(black, red) 1 100%;
-o-border-image:
-o-linear-gradient(black, red)) 1 100%;
-moz-border-image:
-moz-linear-gradient(black, red) 1 100%;
}
</style>
<div class=»foo»>Lorem</div>
Answers:
• The text «Lorem» will be colored black-red.
• The div element will be colored black-red.
• The border of div element will be colored black-red.
• None of these.