Your browser doesn't support the features required by impress.js, so you are presented with a simplified version of this presentation.
For the best experience please use the latest Chrome, Safari or Firefox browser.
Contents
What is RWD?
Why RWD?
Alternatives?
Native vs Mobile Web
How can we achieve it?
Viewport
<meta name="viewport" content="width=device-width,
initial-scale=1.0, maximum-scale=1.0, user-scalable=no" >
Media Queries
Understanding the Query
<link rel='stylesheet' media='all' href='normal.css' >
<link rel='stylesheet' media='screen and (min-width: 701px)'
href='medium.css' >
@media screen and (-webkit-device-pixel-ratio: 1.5), screen and
(resolution: 144dpi)
Mobile First Approach
What is this?
RW Menu Component
Step 1 [Basic Menu] View Output
Step 2 [600px and lower]View Output
Step 3 [480px and lower]View Output
Available Frameworks
RWD ToolsAnd many more..
And Finally..
Questions?@aravulavaru