css - 如何在 CSS 中为 Ipad 和平板电脑的纵向和横向设置媒体查询

Question

当我使用此代码(见下文)时，媒体查询不起作用

@media (min-width: 768px) and (orientation : portrait) { //scss code }

但是当我删除 'and (orientation : portrait)' 部分时它起作用了。即

//this code works
@media (min-width: 768px) { //scss code }

如何在 CSS 中为 Ipad 和平板电脑设置纵向和横向的媒体查询？

PS:我正在为网络编写一个响应式布局，我正在使用 scss mixins(不知道这是否会影响任何东西。)

Answer 1

试试这段代码

    @media screen and (min-width: 768px) and (max-width: 992px) { 
    /* STYLES HERE */
    }