CSS Responsive Web Design

    What is Responsive Web Design?

    Initially, web-pages were only built for desktop web-browsers. But now there are many devices present in the market that can access your web page, so to make a web-page look good on every device, we approach Responsive web-designing. In Responsive Web Designing, we create such web pages that look good on every device and adjust according to the user browser screen or viewport. To Create a responsive web-page, we need only HTML and CSS, even without using JavaScript, we can build a solid Responsive Web-Page.

    Web-Page Experience with Different Devices

    These days a user can use any device to access a web-page, it could be a desktop, tablet, phone, or even smartwatch. It’s a Job of the web-designer and front-end developer to built a Responsive user interface that looks good on every device. Responsive Web Designing (RWD) is not about creating different CSS and HTML documents for different devices. In RWD, we create HTML and CSS documents that fit the web page content according to the device display area. [caption id="attachment_7215" align="alignnone" width="150"]

    Desktop[/caption] [caption id="attachment_7214" align="alignnone" width="120"]

    Tablate[/caption] [caption id="attachment_7213" align="alignnone" width="70"]

    Mobile [/caption] A Responsive web page resizes, hide, enlarge, move, shrink, and display the content of the page according to the user screen.

    Summary

    • In Responsive Web Designing, we deal with creating web-pages that look good on every device.
    • To check if your code looks on every device, use the inspect feature of your browser ctrl+shift+I.
    • Only CSS and HTML is required to build a Responsive Web Page.
    • Mostly all the web-pages on the internet are Responsive; that’s why they have a little different UI for desktop and Mobiles.