如何使這個頁面響應？
[英]How to make this page responsive?
問題描述
我有一個從 Adobe XD 導出的背景圖像（ LINK 1 、 LINK 2 ）。 圖像的高度超過 9k 像素。 由於這是我第一次處理 Adobe XD 文件，我不知道如何使該頁面具有響應性。
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
</body>
</html>
CSS :
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
display: grid;
height: 9289px;
width: 100%;
font-size: 40px;
background-image: url('Home.png');
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
box-sizing: border-box;
}
1 個解決方案
解決方案1
0 2021-07-14 01:02:34
將背景大小更改為包含應該會有所幫助。
如果 background-size 屬性設置為“包含”，背景圖像將縮放，並嘗試適應內容區域。 但是，圖像將保持其縱橫比（圖像的寬度和高度之間的比例關系）：
如何使此頁面響應
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.