cari

Rumah >hujung hadapan web >tutorial js >web中媒体查询的方法

web中媒体查询的方法

一个新手
一个新手asal
2017-10-05 15:32:501837semak imbas

定位布局

媒体查询的代码：

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> .a {
    border: 1px solid #000000;
    width: 100px;
    height: 100px;
    background-color: #000000;
}
@media only screen and (min-width: 300px) and (max-width: 640px) {
    .a {
    background-color: red;
}
} @media only screen and (min-width: 700px) {
    .a {
    background-color: green;
}
} @media only screen and (max-width:200px ) {
    .a {
    background-color: blue;
}
} </style> </head> <body> <p class="a"></p> </body></html>

Atas ialah kandungan terperinci web中媒体查询的方法 . Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：JS中的MD5加密方法Artikel seterusnya：如何理解 redux

Artikel berkaitan

Lihat lagi