我是 HTML 和 CSS 領域的新手。一天前我做了我的第一個網站,我想知道你是否可以幫助我防止我的頁面元素在解析度改變時改變位置。我已經把這個發給了一位同事,他的解析度比我低,他需要在他的螢屏上縮小才能像我一樣看到它。
我當然進行了研究,我發現當我放置這個名為“視口”的元時,它會適應不同設備(甚至手機)上的解析度,但沒有任何改變。
<meta name="viewport" content="width=device-width, initial-scale=1.0">
uj5u.com熱心網友回復:
這就是@media 查詢基本上在 css 中所做的。嘗試調整您的頁面寬度,您會看到變化。所以,基本上,標題的默認顏色是深紅色(有點紅),但是當螢屏寬度為 800 或小于 800 時,它的顏色將為綠色。
您可以將此邏輯應用于您的頁面并使其全部作業。我知道如果你有一個很大的網站并且必須自己重新渲染它會很累,但它仍然非常適合對齊專案。
欲了解更多回應頁面,了解更多關于自舉這里,和大約Flexbox的位置。
#header1{
color:crimson;
}
@media only screen and (max-width: 800px) {
#header1{
color:greenyellow;
}
}
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<h1 id="header1">Lorem ipsum dolor sit amet.</h1>
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/344721.html
上一篇:如何將flex中的文本與徽標對齊
下一篇:僅使用html和css洗掉DIV
