判断手机横竖屏并执行不同CSS

当你不想设计网页的竖屏样式…

@media screen and (orientation: portrait) {
  }
/*若为竖屏，则执行大括弧内的元素*/

@media screen and (orientation: landscape) {
  }
/*若为横屏，则执行大括弧内的元素*/

在主页面index.php的<body>下加入<div class=”screentip”></div>

style.css内加入

.screentip {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #000 url(img/landscape.svg) no-repeat center center;
  background-size: cover;
  z-index: 7;
  display: none;
  }
/*（此方案不让用户查看竖屏）landscape.svg换成自己的文件*/