<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> @media only screen and (min-width:1001px ) { #aa{ background-color: red; font-size: 24px; } } @media only screen and (min-width:600px ) and (max-width:1000px) { #aa{ background-color: blue; font-size: 18px; } } @media only screen and (min-width:400px )and (max-width:599px) { #aa{ background-color: orange; font-size: 12px;} } #aa{ width: 200px; height: 200px; } </style> </head> <body> <div id="aa"> 下午有事 </div> <div id="a1"> 学习java </div> </body> </html>
