Created
April 21, 2017 06:05
-
-
Save gatesakagi/7b6125a69acd20b990a89dfe5e7506dc to your computer and use it in GitHub Desktop.
RWD於電腦版及手機版的切換語法
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, minimun-scale=1.0"> | |
| <title>Document</title> | |
| <style type="text/css"> | |
| div { | |
| width: 300px; | |
| height: 200px; | |
| } | |
| div.mobile { | |
| display: none; | |
| background: #01B0F0; | |
| } | |
| div.desktop{ | |
| background-color: #63A69F; | |
| } | |
| @media (max-width: 1024px) { | |
| div.desktop { | |
| display: none; | |
| } | |
| div.mobile { | |
| display: block; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="mobile"> | |
| 這是手機板 | |
| </div> | |
| <div class="desktop"> | |
| 這是桌機板 | |
| </div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment