求一个首页 html 代码, 只放一个图片可以兼容适配市面上大部分手机/屏幕浏览器尺寸的

由于官网没时间做, 特求一个 Html 代码临时对付放张高清图片可以适配市面上大部分手机/PC 屏幕浏览器尺寸的. 有人会问为什么不谷歌, 其实已经谷歌过了, 乱七八糟的太多了, 不如这里更直接专业.

zictos

203 天前

<!DOCTYPE html>
<html lang="zh">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>Image</title>

<style>
body {
background-color: #fdfcf8;
margin: 0 auto;
max-width: 1024px;
}

#main {
display: flex;
justify-content: center;
align-items: center;
background-color: white;
padding: 25px;
}

img {
max-width: 100%;
}

@media screen and (max-width: 760px) {
#main {
padding: 5px;
}
}
</style>

</head>

<body>
<div id="main">
<p><img src="https://img10.360buyimg.com/imgzone/jfs/t1/228236/14/15858/52860/662b334bFe7dd93f0/79959161ec860c49.png" alt=""></p>
</div>

</body>

</html>

old9

203 天前

serafin

202 天前

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>serafin</title>
<style>
body {
background-color: #292929;
}

img {
border: none;
display: block;
margin: auto;
max-width: 100%;
max-height: 100%;
}
</style>
</head>
<body>
<img src="s.png">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$(window).on('resize', function() {
$('body').height($(window).height());
}).trigger('resize');
});
</script>
</body>
</html>

serafin

202 天前

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>serafin</title>
<style>
body {
background-color: #292929;
margin: 0;
padding: 0;
}

img {
border: none;
display: block;
margin: auto;
max-width: 100%;
max-height: 100%;
}
</style>
</head>
<body>
<img src="s.png">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$(window).on('resize', function() {
$('body').height($(window).height());
}).trigger('resize');
});
</script>
</body>
</html>

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1037483

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.