在Wordpress中编辑CSS媒体查询

Question

这是我第一次尝试自己进行媒体查询。我通常可以很容易地学习这些东西，但我一直在寻找，而且那里有我不理解的东西。我通过Wordpress工作，我正在尝试编辑媒体查询中的内容样式。我使用自动响应的The7主题，但我想在仅适用于设备的内容中进行多次编辑。

如何制作

.element style {
color: #ffffff;
font-size: 48pt;
line-height: 50pt;
}

成为

color: #ffffff;
font-size: 20pt;
line-height: 21pt;
max-width: 480px;

媒体查询中的

？我是否将.class1之类的div类分配给普通代码，然后添加第二个类，在.class2 .class1等媒体查询中覆盖它？我该怎么做呢？非常感谢任何帮助。

Answer 1

班级保持不变。它会是这样的：

.element {
    color: #ffffff;
    font-size: 48pt;
    line-height: 50pt;
}

@media screen and (max-width: 480px) {
    /* change the breakpoint above to suit your needs */ 
    .element{
        font-size: 20pt;
        line-height: 21pt;
        max-width: 480px;
    }
}