1. Which input type displays a slider?
- slider
- range
- number
- scroll
Answer: B) range
Explanation: type="range" renders a slider control.
MCQs / Computer Science / HTML5 for Mobiles
HTML5 for Mobiles MCQs — Computer Science
39 multiple-choice questions on HTML5 for Mobiles from Computer Science, each with the correct answer and, where available, a teacher's explanation. Read through them to revise the chapter, then practise the same questions one by one to test yourself.
2. Connecting label for="email" to input id="email" helps mobile users because:
- It validates the email
- It hides the field
- Tapping the label focuses the field and screen readers announce it
- It changes the keyboard
Answer: C) Tapping the label focuses the field and screen readers announce it
Explanation: Associated labels enlarge the tap area and improve accessibility.
3. Which HTML5 element should contain the main navigation links?
- aside
- section
- nav
- header
Answer: C) nav
Explanation: The nav element represents a block of navigation links.
4. Which is a major advantage of HTML5 mobile web apps over native apps?
- Listed automatically in the App Store
- Full Bluetooth access
- One code base runs on all platforms and updates instantly
- Always better performance
Answer: C) One code base runs on all platforms and updates instantly
Explanation: Web apps run anywhere with a browser and update on the server.
5. The srcset attribute of an img element is used to:
- Add a caption
- Lazy-load scripts
- Offer images of different resolutions so the browser picks the best one
- Set the alt text
Answer: C) Offer images of different resolutions so the browser picks the best one
Explanation: srcset lists alternative image files and widths for responsive images.
6. HTML5 pages declare the document type with:
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
- <doctype mobile
- <!DOCTYPE html
- <html version="5"
Answer: C) <!DOCTYPE html
Explanation: HTML5 uses the short doctype <!DOCTYPE html.
7. Which is NOT a requirement for a PWA?
- A web app manifest
- HTTPS
- Approval from Google Play
- A service worker
Answer: C) Approval from Google Play
Explanation: PWAs do not need store approval.
8. Setting user-scalable=no in the viewport tag is discouraged because:
- It slows the page
- It breaks media queries
- It disables JavaScript
- It prevents users with poor eyesight from zooming (accessibility)
Answer: D) It prevents users with poor eyesight from zooming (accessibility)
Explanation: Disabling zoom harms accessibility.
9. Which CSS rule makes images shrink to fit small screens?
- img float: left;
- img width: 2000px;
- img max-width: 100%; height: auto;
- img display: none;
Answer: C) img max-width: 100%; height: auto;
Explanation: max-width 100% keeps images within their container while height auto keeps the ratio.
10. Web Storage typically allows about how much data per site?
- 5 MB
- Unlimited
- 4 KB
- 5 GB
Answer: A) 5 MB
Explanation: Most browsers allow around 5 MB for localStorage per origin.
11. Which media query applies styles only when the device is turned sideways?
- @media (orientation: landscape)
- @media (min-width: 0)
- @media print
- @media (hover: hover)
Answer: A) @media (orientation: landscape)
Explanation: The orientation feature detects portrait or landscape.
12. Which input type opens a native calendar picker?
- calendar
- time-picker
- range
- date
Answer: D) date
Explanation: type="date" displays the browser's native date picker.
13. Which API makes a phone vibrate from a web page?
- device.buzz()
- navigator.motion()
- navigator.vibrate()
- window.shake()
Answer: C) navigator.vibrate()
Explanation: The Vibration API uses navigator.vibrate(milliseconds).
14. Without the viewport tag, mobile browsers typically render the page as if it were about:
- 100 px wide
- 980 px wide and then zoom out
- 320 px wide
- 1920 px wide
Answer: B) 980 px wide and then zoom out
Explanation: Mobile browsers assume a desktop-like width of about 980 px and shrink the page.
15. Which meta tag makes a page use the real device width on phones?
- <meta http-equiv="mobile"
- <meta name="screen" content="mobile"
- <meta name="width" content="100%"
- <meta name="viewport" content="width=device-width, initial-scale=1.0"
Answer: D) <meta name="viewport" content="width=device-width, initial-scale=1.0"
Explanation: The viewport meta tag sets the layout viewport to the device width with no initial zoom.
16. Which three technologies together build a mobile web app?
- Swift, UIKit and Xcode
- Kotlin, XML and Gradle
- HTML5, CSS3 and JavaScript
- C, C++ and Assembly
Answer: C) HTML5, CSS3 and JavaScript
Explanation: HTML structures, CSS styles and JavaScript adds behaviour.
17. The three ingredients of responsive web design are:
- Fluid grids, flexible images and media queries
- Frames, tables and Flash
- HTML, PHP and SQL
- Cookies, sessions and caching
Answer: A) Fluid grids, flexible images and media queries
Explanation: Ethan Marcotte defined RWD as fluid grids, flexible images and media queries.
18. Which HTML5 feature replaced the need for the Flash plug-in for media?
- canvas element
- Web Storage
- nav element
- Native audio and video elements
Answer: D) Native audio and video elements
Explanation: The audio and video elements play media natively without plug-ins.
19. Which input type shows a keyboard with the @ symbol and validates the format?
- search
- url
- text
Answer: A) email
Explanation: type="email" shows an email keyboard and validates the address format.
20. Which shortcut opens device emulation mode in Chrome DevTools?
- Ctrl + D
- Ctrl + Shift + M
- Ctrl + P
- F5
Answer: B) Ctrl + Shift + M
Explanation: Ctrl + Shift + M toggles the device toolbar in DevTools.
21. The Geolocation API works only on pages served over:
- HTTPS (secure context)
- Local files only
- HTTP without encryption
- FTP
Answer: A) HTTPS (secure context)
Explanation: Browsers require a secure context (HTTPS) for geolocation.
22. For an Urdu web page, which attributes should be set on the html element?
- lang="pk" dir="up"
- charset="urdu"
- lang="en" dir="ltr"
- lang="ur" dir="rtl"
Answer: D) lang="ur" dir="rtl"
Explanation: Urdu is written right-to-left, so lang="ur" and dir="rtl" are used.
23. The attribute capture="environment" on a file input:
- Captures GPS location
- Saves form data
- Opens the rear camera directly on mobile devices
- Records the screen
Answer: C) Opens the rear camera directly on mobile devices
Explanation: On phones it asks the browser to open the back camera for capturing an image.
24. In a web app manifest, "display": "standalone" means the app:
- Opens in a new browser tab
- Prints automatically
- Runs only on desktop
- Opens without browser UI, like a native app
Answer: D) Opens without browser UI, like a native app
Explanation: standalone hides the browser address bar so it looks like an app.
25. Which HTML5 element provides a drawing surface for JavaScript graphics and games?
- picture
- canvas
- figure
- svg-area
Answer: B) canvas
Explanation: canvas offers a bitmap drawing area controlled by JavaScript.
Page 1 of 2 Next
Practise HTML5 for Mobiles MCQs
More Computer Science chapters
- Unit 1: Computer Systems MCQs
- Introduction and History of Computers MCQs
- Introduction to Mobile Applications and Platforms MCQs
- Unit 2: Computational Thinking and Algorithms MCQs
- Types of Computers and Basic Operations MCQs
- Unit 3: Programming Fundamentals MCQs
- Input and Output Devices MCQs
- Android OS: Architecture, Framework and Application Development MCQs
- Unit 4: Data and Analysis MCQs
- Storage Units and Memory MCQs
- iOS: Architecture and Framework MCQs
- Unit 5: Application of Computer Science MCQs