媒体查询media的3种引入方式
生活随笔
收集整理的這篇文章主要介紹了
媒体查询media的3种引入方式
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
利用@media引入
在<style>...</style>標(biāo)簽里使用@media來(lái)實(shí)現(xiàn)媒體查詢
<style>@media (min-device-width: 300px) and (max-device-width: 500px) {#box {width: 100px;height: 100px;background-color: cadetblue;}}@media (min-device-width: 501px) {#box {width: 100px;height: 100px;background-color: blueviolet;}}</style>style標(biāo)簽上使用media
在<style>...</style>標(biāo)簽上使用media=""
<style media="(min-device-width: 300px) and (max-device-width: 500px)">#box {width: 100px;height: 100px;background-color: cadetblue;}</style>link標(biāo)簽上使用media
在<link>...</link>標(biāo)簽上使用media=""
<head><linkrel="stylesheet" href="./style1.css"media="(min-device-width: 300px) and (max-device-width: 500px)"/><linkrel="stylesheet" href="./style2.css"media="(min-device-width: 501px)"/> </head>總結(jié)
以上是生活随笔為你收集整理的媒体查询media的3种引入方式的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 卖烟花爆竹的宣传文案30句
- 下一篇： PC菜单筛选器