media queries CORRECT ANS-determine the properties of the device rendering the page so
that appropriate designs can be delivered to specific devices; used to associate a style sheet
or style rule with a specific device or list of device features; When no media attribute is used,
it is assumed to apply to all devices accessing the web page.
@media screen and (device-width: 320px) { style rules } (applies the style rules only for screen
devices with a width of 320 pixels.)
@media all and (min-width: 320px and max-width: 480px) { style rules } (applies to all media
types but only when the width of the output devices is between 320 and 480 pixels)
@media not screen and (max-width: 480px) { style rules } (applies only to media devices that
are not screen or do not have a maximum width of 480 pixels)
, ISDS 3105 LSU Exam 2- Questions and Answers
Tablet styles are applied when the screen width is ______________ and desktop styles build
upon the tablet styles when the screen width exceeds _______________ CORRECT ANS-
481 pixels or greater; 768 pixels
To match the width of the layout viewport to the device width CORRECT ANS-<meta
name="viewport" content="properties" />
2 key components of web design for mobile devices CORRECT ANS-- have the most
important information up-front and easily accessible, free of unnecessary clutter.
- limit the choices you offer to your users; there should only be a few navigation links on the
screen at any one time.
To hide a submenu: CORRECT ANS-ul.submenu { display: none; }
To display a nested submenu only when the user hovers the mouse over its submenu title and
remain visible as the pointer moves away from the title and hovers over the now-visible
submenu. CORRECT ANS-a.submenuTitle:hover+ul.submenu, ul.submenu:hover { display:
block; }
You can't use ul.submenu:hover selector alone because you can't hover over the submenu
until it's visible and it won't be visible until you first hover over the submenu title.
, ISDS 3105 LSU Exam 2- Questions and Answers
4 ways to Optimize Your Site for the Mobile Web CORRECT ANS-Keep it simple
Resize your images.
Scroll vertically (Limit yourself to one column of information in portrait orientation and two
columns in landscape.)
Make your links accessible.
One of the challenges of a grid system approach under responsive design CORRECT ANS-
you need to establish a different grid layout for each class of screen size.
flexible box or flexbox CORRECT ANS-a box containing items whose sizes can shrink or
grow to match the boundaries of the box
To define an element as a flexbox, CORRECT ANS-display: flex;
or
display: inline-flex;
browser extensions that define a flexbox CORRECT ANS-display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex:
display: flex;
The benefits of buying summaries with Stuvia:
Guaranteed quality through customer reviews
Stuvia customers have reviewed more than 700,000 summaries. This how you know that you are buying the best documents.
Quick and easy check-out
You can quickly pay through credit card or Stuvia-credit for the summaries. There is no membership needed.
Focus on what matters
Your fellow students write the study notes themselves, which is why the documents are always reliable and up-to-date. This ensures you quickly get to the core!
Frequently asked questions
What do I get when I buy this document?
You get a PDF, available immediately after your purchase. The purchased document is accessible anytime, anywhere and indefinitely through your profile.
Satisfaction guarantee: how does it work?
Our satisfaction guarantee ensures that you always find a study document that suits you well. You fill out a form, and our customer service team takes care of the rest.
Who am I buying these notes from?
Stuvia is a marketplace, so you are not buying this document from us, but from seller TheeGrades. Stuvia facilitates payment to the seller.
Will I be stuck with a subscription?
No, you only buy these notes for $19.99. You're not tied to anything after your purchase.