不改變字體大小的媒體查詢

-1

我想爲網站製作標題，並且我使用的字體大小在達到一定寬度時需要更改。當你用不同的寬度加載頁面時，他們會加載正確的字體，但是當你改變視口大小時，他們不會改變字體。不改變字體大小的媒體查詢

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Example</title> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="assets/js/results.js"></script> 
</head> 
<body> 
<div class="header"> 
<img src="Logo_whiteTextandCar_exactsize.png" alt="Baja Logo"> 
<div id="main_header"> 
     <span>ABOUT</span> 
     <span>TEAM</span> 
     <span>RESULTS</span> 
     <span>GALLERY</span> 
     <span>SPONSORS &amp; DONATE</span> 
    </div> 
</div>

而且style.css中：

@media screen and (max-width: 980px){ 
    .header{ 
     font-size: 12pt; 
    } 
}

來源

2017-01-16 bill

[我不能重現該問題（HTTP：// jsbin .com/loxili/1/edit？html，output）[mcve] – Quentin

這是你的真實代碼嗎？我的意思是，你的CSS就像HTML一樣嗎？ –

不，它是在style.css文件 – bill

-2

嵌入式CSS樣式必須標記之間寫：<style></style>

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Example</title> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="assets/js/results.js"></script> 

    <style> 
     @media screen and (max-width: 980px){ 
     .header{ 
      font-size: 12pt; 
     } 
     } 
    </style> 

</head> 
<body> 
<div class="header"> 
<img src="Logo_whiteTextandCar_exactsize.png" alt="Baja Logo"> 
<div id="main_header"> 
     <span>ABOUT</span> 
     <span>TEAM</span> 
     <span>RESULTS</span> 
     <span>GALLERY</span> 
     <span>SPONSORS &amp; DONATE</span> 
    </div> 
</div> 
</body> 
</html>

來源

2017-01-16 20:33:00 Sejnek

它在外部文件風格.css我只是在這裏格式錯誤 – bill

不改變字體大小的媒體查詢

回答

相關問題