media query
@media only screen and (max-width: 600px) {
body {
background-color: lightblue;
}
}media query
@media only screen and (max-width: 600px) {
body {
background-color: lightblue;
}
}media query for mobile landscape only
@media screen and (orientation:landscape) and
(min-device-width: 320px) and (max-device-width: 450px) {
/* Input Styles */
}media query
@media (max-height : 800px){ /* from 0 to 800 px max height applies */
p{
font-size:10px
}
}media query only screen
@media not|only mediatype and (mediafeature and|or|not mediafeature) {
CSS-Code;
}
meaning of the not, only and and keywords:
not: The not keyword inverts the meaning of an entire media query.
only: The only keyword prevents older browsers that do not support media queries with media features from applying the specified styles. It has no effect on modern browsers.
and: The and keyword combines a media feature with a media type or other media features.
They are all optional. However, if you use not or only, you must also specify a media type.Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
