CSS Multiple Choice Questions & Answers on CSS3 Animation with Responsive Web Design for Freshers

1. Which of the following css property should be used to make a responsive image?

a) float
b) max-width
c) margin-right
d) all of the mentioned
Answer: d
2. What should be written in the blank of the code for resizing elements in Responsive Web Design with Transitions

Code:
body { background-image: url(fog.jpg); background-size: cover;
background-repeat: no-repeat; color: #fff; font-family: Avenir, Arial, sans-serif;
}
h1 { font-family: 'Calluna Sans', Arial, sans-serif; text-align: center;
font-size: 10rem; margin: 8rem auto;
}
h1 { font-family: 'Calluna Sans', Arial, sans-serif;
text-align: center; font-size: 10rem; margin: 8rem auto; transition: 1s font-size linear;
}
______________ and (max-width: 1100px) {
h1 { font-size: 8rem; }
a) @media
b) @media screen
c) div
d) transform
Answer: b
 
 
3. What should be written in the blank of the code for JQuery Code Used to Apply CSS3 Animations?
Code:
_________ leftmove {
100% { transform: translateX(-70px); opacity: 1; }
}
_________ rightmove {
100% { transform: translateX(70px); opacity: 1; }
}
>
a) @media
b) @keyframes
c) animation-name
d) !important
Answer: b
4. Which of the following CSS framework is used to create a responsive design?

a) larawell
b) bootstrap
c) rails
d) django
Answer: b

Explanation: Bootstrap is a free and open-source collection of tools for creating websites and web applications. It contains HTML- and CSS-based design templates for typography, forms, buttons, navigation and other interface components, as well as optional JavaScript extensions. It aims to ease the development of dynamic websites and web applications.
5. Which of the following code set the webpage correctly displayed on a device?
a) =
"viewport" content="width=device-width, initial-scale=1.0"> b) ="viewport" content="width=device-width, initial-scale=2.0"> c) ="viewport" content="width=device-width, initial-scale='parent-size'"> d) ="viewports" content="width=device-width, initial-scale=1.0">
Answer: a
 

6. What does this code do?
Code:
 @media only screen and (max-width: 500px) {
    body {
        background-color: lightblue;
    }
}
a) If the browser window is smaller than 500px, the background color will change to lightblue:
b) If the browser window is larger than 500px, the background color will change to lightblue:
c) The background color will change to lightblue
d) Nothing happens
Answer: a
7. What does this code do?
Code:
@media only screen and (orientation: landscape) {
    body {
        background-color: lightblue;
    }
}
a) web page will have a lighblue background if the orientation is in landscape mode
b) web page will have a lighblue background if the orientation is not in landscape mode
c) web page will have a red background if the orientation is in landscape mode
d) None of the mentioned
Answer: a
8. Which of the following css propery defines a relationship between bound elements(s) and some code or content?

a) @import
b) @media
c) url-bind
d) binding
Answer: d

Explanation:
Syntax: binding: none | url(bindingfile)
9. What does this code do?
Code:
@media only screen and (max-width: 768px) {
    class*="col-"] {
        width: 100%;
    }
}
a) When the screen gets larger than 768px, each column should have a width of 100%.
b) When the screen gets smaller than 768px, each column should have a width of 100%.
c) Error occured
d) None of the mentioned
Answer: b
10. Which of the following css propery define the properties that will be animated in an animation rule?

a) @keyframes
b) animation-origin
c) transform
d) animation
Answer: d

Explanation:
Syntax: @keyframes: keyframe-name {percentage | from | to {cssrules}}

Related

multiple choice Questions and Answers on Service Types of Cloud Computing

1. Which of the following is a specific top-level domain created for the producers and consumers of mobile services? a) MOBb) .MOBIc) CELLd) None of the mentioned Answer: a Explanation: .MOBI is ...

Computer Fundamentals Multiple choice Questions and Answers on FORTRAN Basics for Freshers

1. Which is interpreted language? a) C++b) Cc) MATLABd) Fortran Answer: c Explanation: MATLAB is an interpreted language. All the other languages are compiled languages. In the case of Interprete...

multiple choice Questions and Answers on Mobile Web Services of Cloud Computing

1. Which of the following is a push mechanism for publishing Web site data that is device-specific? a) WAPb) GPRSc) GAPd) None of the mentioned Answer: a Explanation: WAP stands for Wireless Acce...

Post a Comment

emo-but-icon
:noprob:
:smile:
:shy:
:trope:
:sneered:
:happy:
:escort:
:rapt:
:love:
:heart:
:angry:
:hate:
:sad:
:sigh:
:disappointed:
:cry:
:fear:
:surprise:
:unbelieve:
:shit:
:like:
:dislike:
:clap:
:cuff:
:fist:
:ok:
:file:
:link:
:place:
:contact:

item