移动端h5横竖屏不同css

最近项目手写签名要求页面必须横竖屏样式统一，让客户横向签名。解决办法如下：
让其横竖屏不同css样式，展示相同的视觉效果。

//竖屏
 @media screen and (orientation: portrait){
body{
    background-color:red;
}
 }
//横屏
 @media screen and (orientation: landscape){
 　    background-color: green;
 }