CSS Test

CSS Test

 

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>

a. The text “Lorem” will be colored black-red.
b. The div element will be colored black-red.
c. The border of div element will be colored black-red.
d. None of these.


Which of the following is not a valid page break?

a. page-break-inside
b. page-break-outside
c. page-break-before
d. page-break-after
e. None of these


Which of the following option does not exist in media groups available in CSS3?

a. continuous or paged
b. visual or tactile
c. grid or bitmap
d. braille or screen


The min-width property cannot be applied to the following element:

a. button
b. span
c. table row


Which of the following will create a triangle effect using pure CSS3 on a white background, without making use of background images?

a. It is not possible to do so.
b. border-color: #a0c7ff #ffffff #ffffff #ffffff; border-style: solid; border-width: 20px; width: 0px; height: 0px;
c. background-color: #a0c7ff #ffffff #ffffff #ffffff; border-style: solid; border-width: 20px; width: 0px; height: 0px;
d. background-color: #a0c7ff #ffffff #ffffff #ffffff; border-style: solid; border-width: 1px; width: 10px; height: 10px;

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?

a. In style rule add this code “#sectors > div:not(.C):not(.D):not(.E) {background-color: blue;}”
b. In style rule add this code “#sectors > div:not(.C, .D, .E) {background-color: blue;}”
c. Both A and B
d. None of the above


Consider the following font definition:

font-weight:normal

What is the other way of getting the same result?

a. font-weight:100
b. font-weight:900
c. font-weight:400
d. font-weight:700


Can a percentage value be given in a ruby-align property?

a. Yes
b. No


For the clear property, which of the following values is not valid?

a. none
b. left
c. right
d. top


Consider the following code:

div[class^=”stronger”] { }
{em

}

Which of the following statements is true?

a. It applies the rule only on divs who belong to a class that begins with “stronger”.
b. It applies the rule only on divs of class “stronger”.
c. It applies the rule only on divs who belong to a class which end with “stronger”.
d. It applies the rule only on divs who belong to a class which does not contain “stronger” in its name.


Which of the following is not a valid value for the font-smooth property?

a. auto
b. never
c. always
d. normal
e. length


Prev1 of 7

Share This Post