DRAG DROP
You are developing a web page that will be accessed from various types of devices.
You have the following requirements:
The appropriate display resolution must be selected dynamically based on the device that is connecting to
the page.
Mobile devices with a maximum width of 480 pixels must be able to use the page.
You need to ensure that the page displays correctly on any device.
How should you build the code? (To answer, drag the appropriate media statement to the correct location. Each
media statement may be used once, more than once, or not at all. You may need to drag the split bar between
panes or scroll to view content.)
Select and Place:
Explanation:
* The @media rule is used to define different style rules for different media types/devices.
CSS Syntax
@media not|only mediatype and (media feature) {
CSS-Code;
}
* Media type: Screen
Used for computer screens.
Incorrect Answers:
Not size: there is no media type size.Reference: CSS3 @media Rule; CSS Media Types