HTML/CSS響應文本

我正在開發我的第一個響應式網站。我已閱讀並對此有相當理解。我碰到的其中一個問題是使用文本或h1-6標題。例如，我在調整瀏覽器大小時想調整一個按鈕。該按鈕在一個類下。也在該CSS文件中，我只有一個@media屏幕和（min-width：320px）{...在括號內，我調用了相同的類，寬度爲max-width：50％。這工作完美。我遇到的問題是，如果我再次使用元素，它將替換整個頁面，即使我正在全屏查看它。HTML/CSS響應文本

我想說的是，例如我有一個名爲「保持按鈕」的CSS內部我有它的字體大小：25px。現在，當我轉到@media屏幕和（min-width：320px）{並將字體大小更改爲15px時。而不是在320px屏幕上將字體大小更改爲15px，而是將其作爲整個頁面。我試過使用字體大小調整，但沒有奏效。

下面是它的示例代碼：

.keep-button { 
    height: 70px; 
    width: 430px; 
    background-color: #C60; 
    margin: auto; 
    margin-top: 115px; 
} 

h5 { 
    font-size: 25px; 
    color: #FFFFFF; 
    text-align: center; 
    padding: 20px 0; 
} 


@media only screen and (min-width : 320px) { 

.keep-button { 
    max-width: 50%; 

} 

h5 { 
    font-size: 15px; 
    font-size-adjust: .50; 
} 


}

來源

2015-09-06 Hashtag

我認爲你需要改變@media only screen and (min-width : 320px)到 @media only screen and (max-width : 320px)。現在當頁面小於320px時，您的規則將被應用。另外，請嘗試瞭解有關媒體查詢的文章this。

來源

2015-09-06 21:37:43 AleshaOleg

非常感謝你的鏈接！有意義的最大寬度不能相信我錯過了那部分。但是它仍然沒有解決它。現在看來，我在@media部分做的任何事情都會被忽略，例如，如果對於h5，我希望字體顏色在該屏幕大小時變成紅色，當我放置顏色時：紅色;它不會改變字體大小。即使保持按鈕中的最大寬度也不會將其更改爲50％，當我將其從最小值改爲最大值時 – Hashtag

這是我解決問題的方法，以防止任何人感興趣而不是** @ media only screen和（max-width：320px）**我將它改爲** @ media all和（max-width：599px）和（min-width：320px）** – Hashtag

@Hashtag看看[this]（https：// jsfiddle.net/hLqo1bpu/s）。一切工作正常！ – AleshaOleg

HTML/CSS響應文本

回答

相關問題