When we go through a website it is not respond for devices' screen size it become major problem for the user and failure for the server.So that when a website is response for a screen size it is called responsive web design and it become success for all.
Features as follows
1.Media queries
css uses media queries to adapt a website content in a diiferent manner.
@media only screen and (max-width: 480px){
.page-title {
width: 270px;
}
}
2.Range
It is used to target the specified screen size by setting multiple size.
@media only screen and (min-width: 320px) and (max- width: 480px) , (orientation: portrait) {
.gallery-item .thumbnail {
width: 95%;
}
}
3.Dots Per Inch
It target the resolution of the image and video.
4.Breaking points
Instances where rules were broken.
eg: by observing dimension.
Features as follows
1.Media queries
css uses media queries to adapt a website content in a diiferent manner.
@media only screen and (max-width: 480px){
.page-title {
width: 270px;
}
}
2.Range
It is used to target the specified screen size by setting multiple size.
@media only screen and (min-width: 320px) and (max- width: 480px) , (orientation: portrait) {
.gallery-item .thumbnail {
width: 95%;
}
}
3.Dots Per Inch
It target the resolution of the image and video.
4.Breaking points
Instances where rules were broken.
eg: by observing dimension.
![]() |
Simple key what is responsive web design |
Comments
Post a Comment