1D0-720 Sample Questions & Answers
CSS function, syntax and style-guide fundamentals get the most attention, alongside transitions with 2D and 3D transformations, HTML5 for apps versus mobile sites, accessibility and form validation, the Canvas API and DOM, and JavaScript functions tied to user events.
Launch the full 1D0-720 simulator →Showing 6 of 12 free samples.
- Question 1Intermediate
HTML5 Essentials · Images for Mobile Webpages
To optimize bandwidth for mobile users, an engineer is implementing responsive images. They need the browser to automatically select between a standard resolution image and a high-resolution (Retina) image based strictly on the device's pixel density.
Which HTML5 attribute should be applied to the tag to achieve this?
Show answer & explanation
Correct answer: A
The 'srcset' attribute allows developers to specify multiple image sources along with their pixel density descriptors (like 1x, 2x). The browser uses this information to intelligently download the most appropriate image for the user's screen density.
- Question 2Beginner
HTML5 Essentials · HTML5 Code Validation
True or False: The W3C Markup Validation Service can evaluate a mobile webpage's HTML5 code to identify missing closing tags and deprecated elements, ensuring universal markup compliance.
Show answer & explanation
Correct answer: A
True. The W3C Markup Validation Service checks the markup validity of Web documents in HTML, XHTML, SMIL, MathML, etc. It identifies syntax errors, missing closing tags, and the use of deprecated elements, which is a critical step in creating universal, standards-compliant markup for both desktop and mobile platforms.
- Question 3Intermediate
Cascading Style Sheets (CSS) Technology and CSS Version 3 (CSS3) · CSS Function and Purpose
During a UI redesign, an overriding style is not applying to a navigation link. The stylesheet contains the following selectors targeting the same element:
1:
nav ul li a
2:.menu-item a:hover
3:#primary-nav a
4:a[data-active="true"]According to CSS specificity rules, which selector has the highest specificity weight?
Show answer & explanation
Correct answer: A
Specificity is calculated by counting IDs, Classes/Attributes/Pseudo-classes, and Elements (A, B, C).
#primary-nav ahas 1 ID and 1 Element (1,0,1). This is higher than any combination of classes and elements.| Selector | IDs | Classes/Pseudo | Elements | Total Weight | |----------|-----|----------------|----------|--------------| | nav ul li a | 0 | 0 | 4 | 0,0,4 | | .menu-item a:hover | 0 | 2 | 1 | 0,2,1 | | #primary-nav a | 1 | 0 | 1 | 1,0,1 (WINNER) | | a[data-active="true"] | 0 | 1 | 1 | 0,1,1 | - Question 4Beginner
Cascading Style Sheets (CSS) Technology and CSS Version 3 (CSS3) · CSS Box Model
When configuring a grid layout, a designer applies
box-sizing: border-box;to a container with a definedwidthof 300px,paddingof 20px on all sides, and aborderof 5px on all sides.What is the total rendered width of the element on the screen?
Show answer & explanation
Correct answer: A
With
box-sizing: border-box, the specified width (300px) encompasses the content, padding, and border. The browser automatically shrinks the inner content area to accommodate the 40px of total horizontal padding and 10px of total horizontal border, keeping the total rendered width at exactly 300px. - Question 5IntermediateSelect 2
Cascading Style Sheets (CSS) Technology and CSS Version 3 (CSS3) · CSS Positioning and Document Flow
A UI developer is attempting to implement a table header that remains visible at the top of the viewport as the user scrolls down the table. They apply
position: sticky;to theWhich TWO conditions must be met for
position: sticky;to function correctly? (Select TWO)Show answer & explanation
Correct answers: A, B
For an element to become sticky, it requires at least one scroll threshold property (top, right, bottom, or left) to be set. Without this, it behaves like a relatively positioned element.
A sticky element is contained within its nearest scrolling ancestor. If a parent element has
overflow: hidden;,overflow: auto;, oroverflow: scroll;(without actually scrolling), it interrupts the sticky context, preventing the element from sticking relative to the viewport. - Question 6Advanced
Cascading Style Sheets (CSS) Technology and CSS Version 3 (CSS3) · Responsive Web Design (RWD)
To implement a mobile-first Responsive Web Design (RWD) strategy, an architect is defining CSS media queries.
Which approach correctly follows the mobile-first principle for scaling typography?
Show answer & explanation
Correct answer: A
Mobile-first design means writing the default CSS (outside of media queries) for small mobile screens. Then, as the viewport expands,
min-widthmedia queries are used to progressively enhance the layout and typography for tablets, laptops, and desktops.
Ready for the real thing?
The full 1D0-720 simulator has every exam-style question, timed mode, and instant scoring.