2016-08-19 75 views
0

任何人都可以看到为什么这个媒体查询不起作用吗? CSS .header-x1的第一部分工作正常。但是我想在最大宽度为768px时更改字体大小。但是当我在这里运行我的代码时没有任何反应任何人都可以看到为什么?不叫媒体查询

<p class="header-xl"> 
    This is a test 
</p 

.header-xl { 
    font-weight: 900; 
    font-size: 5em; 
    line-height: 1; 
    text-transform: uppercase; 
    color: #fff; 
    padding-top: 160px; 
    } 

@media(max-width:768px) { 
    header-xl { 
     font-size: 8px; 
    } 

回答

4

您缺少a。在媒体查询类,而不是头-XL加.header-XL

@media(max-width:768px) { 
    .header-xl { 
     font-size: 8px; 
    } 
+0

非常感谢你:) –

0

从外观上来看,你需要.header-xlheader-xl媒体查询

0

变化header-xl.header-XL内

@media(max-width:768px) { 
    .header-xl { 
     font-size: 8px; 
    } 
}