由于html代码很长，我不能在这里发帖。很抱歉，请您花几秒钟时间查看该页面：http://foodil.zxq.net/
<head>
<meta http-equiv=Content-Type content="text/html; charset=big5">
<link rel=File-List href="index_files/filelist.xml">
<!--[if !mso]>
<style>
v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
b\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style>
<![endif]-->
<title>Page Title</title>
<style>
<!--
/* Font Definitions */
@font-face
{font-family:"Gill Sans MT";
panose-1:2 11 5 2 2 1 4 2 2 3;}
@font-face
{font-family:Garamond;
panose-1:2 2 4 4 3 3 1 1 8 3;}
@font-face
{font-family:"Lucida Sans Typewriter";
panose-1:2 11 5 9 3 5 4 3 2 4;}
@font-face
{font-family:新細明體;
panose-1:2 2 5 0 0 0 0 0 0 0;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin-right:0pt;
text-indent:0pt;
margin-top:0pt;
margin-bottom:.075pt;
line-height:110%;
text-align:left;
font-family:Garamond;
font-size:10.5pt;
color:black;}
h4
{margin-right:0pt;
text-indent:0pt;
margin-top:0pt;
margin-bottom:6.0pt;
text-align:left;
font-family:Garamond;
font-size:12.0pt;
color:black;
font-style:italic;
font-weight:normal;}
p.MsoListBullet2, li.MsoListBullet2, div.MsoListBullet2
{margin-left:8.6pt;
margin-right:0pt;
text-indent:-8.6pt;
margin-top:0pt;
margin-bottom:6.0pt;
line-height:84%;
text-align:left;
font-family:"Gill Sans MT";
font-size:10.0pt;
color:black;}
p.MsoTitle3, li.MsoTitle3, div.MsoTitle3
{margin-right:0pt;
text-indent:0pt;
margin-top:0pt;
margin-bottom:0pt;
text-align:center;
font-family:"Lucida Sans Typewriter";
font-size:36.0pt;
color:white;
font-weight:bold;}
p.MsoAccentText, li.MsoAccentText, div.MsoAccentText
{margin-right:0pt;
text-indent:0pt;
margin-top:0pt;
margin-bottom:0pt;
text-align:left;
font-family:"Gill Sans MT";
font-size:10.0pt;
color:black;}
p.MsoAccentText4, li.MsoAccentText4, div.MsoAccentText4
{margin-right:0pt;
text-indent:0pt;
margin-top:0pt;
margin-bottom:0pt;
text-align:left;
font-family:"Gill Sans MT";
font-size:9.0pt;
color:white;
font-weight:bold;}
p.MsoAccentText7, li.MsoAccentText7, div.MsoAccentText7
{margin-right:0pt;
text-indent:0pt;
margin-top:0pt;
margin-bottom:0pt;
text-align:left;
font-family:"Lucida Sans Typewriter";
font-size:9.0pt;
color:black;
font-weight:bold;}
p.MsoAccentText8, li.MsoAccentText8, div.MsoAccentText8
{margin-right:0pt;
text-indent:0pt;
margin-top:0pt;
margin-bottom:0pt;
text-align:right;
font-family:"Gill Sans MT";
font-size:9.0pt;
color:white;
font-weight:bold;}
p.MsoOrganizationName, li.MsoOrganizationName, div.MsoOrganizationName
{margin-right:0pt;
text-indent:0pt;
margin-top:0pt;
margin-bottom:0pt;
text-align:center;
font-family:"Lucida Sans Typewriter";
font-size:12.5pt;
color:black;
font-weight:bold;}
p.MsoBodyTextIndent3, li.MsoBodyTextIndent3, div.MsoBodyTextIndent3
{margin-right:0pt;
text-indent:13.5pt;
margin-top:0pt;
margin-bottom:0pt;
line-height:114%;
text-align:justify;
text-justify:inter-ideograph;
font-family:"Times New Roman";
font-size:10.0pt;
color:black;}
ol
{margin-top:0in;
margin-bottom:0in;
margin-left:-2197in;}
ul
{margin-top:0in;
margin-bottom:0in;
margin-left:-2197in;}
@page
{size:8.-2019in 11.2232in;}
-->
</style>
<!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="14342" fill="f" fillcolor="white [7]"
strokecolor="black [0]">
<v:fill color="white [7]" color2="white [7]" on="f"/>
<v:stroke color="black [0]" color2="white [7]">
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
<o:colormru v:ext="edit" colors="#777,#db1101,#b2b2b2,red,blue,#e5e5e5,#5f5f5f,#111"/>
</o:shapedefaults><o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1"/>
</o:shapelayout></xml><![endif]-->
</head>
<body link=maroon vlink="#996600" bgcolor="#777777"
background="index_files/image568.jpg" style='margin:0' width=100%>
<!--[if gte vml 1]><v:background id="_x0000_s3073" o:bwmode="white"
fillcolor="#777" o:targetscreensize="1366,768">
<v:fill angle="-90" focus="100%" type="gradient"/>
</v:background><![endif]-->
<div style='position:absolute;width:8.-1863in;height:11.0484in'>
<!--[if gte vml 1]><v:shapetype id="_x0000_t202" coordsize="21600,21600" o:spt="202"
path="m,l,21600r21600,l21600,xe">
<v:stroke joinstyle="miter"/>
<v:path gradientshapeok="t" o:connecttype="rect"/>
</v:shapetype><v:shape id="_x0000_s1028" type="#_x0000_t202" style='position:absolute;
left:144.56pt;top:195.59pt;width:130.4pt;height:527.24pt;z-index:4;
visibility:visible;mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;
mso-wrap-distance-top:2.88pt;mso-wrap-distance-right:2.88pt;
mso-wrap-distance-bottom:2.88pt' fillcolor="#f5e0d6 [3]" strokecolor="#db1101"
strokeweight=".5pt" insetpen="t" o:cliptowrap="t">
<v:fill color2="white [7]"/>
<v:stroke>
<o:left v:ext="view" color="#db1101" weight=".5pt" joinstyle="miter"
insetpen="t"/>
<o:top v:ext="view" color="#db1101" weight=".5pt" joinstyle="miter"
insetpen="t"/>
<o:right v:ext="view" color="#db1101" weight=".5pt" joinstyle="miter"
insetpen="t"/>
<o:bottom v:ext="view" color="#db1101" weight=".5pt" joinstyle="miter"
insetpen="t"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.7pt' inset="2.85pt,2.85pt,2.85pt,2.85pt">
<div dir=ltr>
<p class=MsoBodyTextIndent3 style='text-indent:0pt'><span lang=en-US
style='font-size:9.0pt;font-family:"Gill Sans MT";language:en-US'>In spite of the significant improvements in face recognition technology over the past two decades, </span><span
lang=en-US style='font-size:9.0pt;font-family:"Gill Sans MT";font-style:italic;
language:en-US'>unconstrained</span><span lang=en-US style='font-size:9.0pt;
font-family:"Gill Sans MT";language:en-US'> face recognition remains a challenging problem due to the large intra-subject variations and small inter-subject variations (see </span><a
href="index_files/Page512.htm"><span lang=en-US style='font-size:9.0pt;
font-family:"Gill Sans MT";color:blue;text-decoration:underline;language:
en-US'>Fig. 1</span></a><span lang=en-US style='font-size:9.0pt;font-family:
"Gill Sans MT";language:en-US'>). Even though some of the major sources of intra-subject variations (</span><span
lang=en-US style='font-size:9.0pt;font-family:"Gill Sans MT";font-style:italic;
language:en-US'>e.g.</span><span lang=en-US style='font-size:9.0pt;
font-family:"Gill Sans MT";language:en-US'>, pose, expression and illumination) can be controlled in constrained imaging environments (</span><span
lang=en-US style='font-size:9.0pt;font-family:"Gill Sans MT";font-style:italic;
language:en-US'>e.g.</span><span lang=en-US style='font-size:9.0pt;
font-family:"Gill Sans MT";language:en-US'>, driver license and passport), age variation is still a challenge in face recognition applications.</span></p>
<p class=MsoBodyTextIndent3 style='text-indent:0pt'><span lang=en-US
style='font-size:9.0pt;font-family:"Gill Sans MT";language:en-US'> </span></p>
<p class=MsoBodyTextIndent3 style='text-indent:0pt'><span lang=en-US
style='font-size:9.0pt;font-family:"Gill Sans MT";language:en-US'>Most of the age invariant face recognition methods proposed in the literature can be categorized into two major classes </span></p>
</div>
</v:textbox>
</v:shape><![endif]--><![if !vml]><span style='position:absolute;z-index:4;
left:192px;top:260px;width:176px;height:705px'><img width=176 height=705
src="index_files/image299.gif"
alt="Text Box: In spite of the significant improvements in face recognition technology over the past two decades, unconstrained face recognition remains a challenging problem due to the large intra-subject variations and small inter-subject variations (see Fig. 1). component based approach uses combinations of segmented facial components to generate aging simulated image. After the aging simulation, the appearance difference between probe and gallery images becomes smaller, resulting in an improved recognition accuracy. Discriminative approaches do not attempt to explicitly learn the appearance changes across ages, but they learn robust feature sets that are invariant to aging variations. As in the generative approaches, "
v:shapes="_x0000_s1028"></span><![endif]><!--[if gte vml 1]><v:shape id="_x0000_s1029"
type="#_x0000_t202" style='position:absolute;left:144.56pt;top:144.56pt;
width:408.19pt;height:45.36pt;z-index:5;visibility:visible;mso-wrap-edited:f;
mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' fillcolor="#ccc [4]"
strokecolor="#db1101" strokeweight=".5pt" insetpen="t" o:cliptowrap="t">
<v:fill color2="white [7]"/>
<v:stroke>
<o:left v:ext="view" color="#db1101" weight="0" joinstyle="miter" insetpen="t"/>
<o:top v:ext="view" color="#db1101" weight="0" joinstyle="miter" insetpen="t"/>
<o:right v:ext="view" color="#db1101" weight="0" joinstyle="miter"
insetpen="t"/>
<o:bottom v:ext="view" color="#db1101" weight="0" joinstyle="miter"
insetpen="t"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.7pt' inset="2.85pt,2.85pt,2.85pt,2.85pt">
<div dir=ltr>
<p class=MsoNormal style='text-align:center;margin-bottom:0pt;line-height:
114%;text-align:center'><span lang=en-US style='font-size:19.6pt;line-height:
114%;font-family:"Gill Sans MT";font-weight:bold;language:en-US'>Age-Invariant Face Recognition</span></p>
<p class=MsoNormal style='text-align:center;margin-bottom:0pt;line-height:
114%;text-align:center'><span lang=en-US style='font-size:10.0pt;line-height:
114%;font-family:"Gill Sans MT";language:en-US'>Unsang Park and Anil K. Jain</span></p>
<p class=MsoNormal style='text-align:center;margin-bottom:10.0pt;line-height:
114%;text-align:center'><span lang=en-US style='font-size:19.6pt;line-height:
114%;font-family:"Gill Sans MT";font-weight:bold;language:en-US'>asd</span></p>
<p class=MsoNormal style='text-align:center;margin-bottom:10.0pt;line-height:
114%;text-align:center'><span lang=en-US style='font-size:8.0pt;line-height:
114%;font-family:"Gill Sans MT";font-weight:bold;language:en-US'> </span></p>
</div>
</v:textbox>
</v:shape><![endif]--><![if !vml]><span style='position:absolute;z-index:5;
left:192px;top:192px;width:546px;height:62px'><img width=546 height=62
src="index_files/image305.gif"
alt="Text Box: Age-Invariant Face Recognition Unsang Park and Anil K. Jain "
v:shapes="_x0000_s1029"></span><![endif]><!--[if gte vml 1]><v:group id="_x0000_s1030"
style='position:absolute;left:144.56pt;top:93.54pt;width:408.19pt;height:49.71pt;
z-index:6' coordorigin="1108901,1056767" coordsize="61471,11623">
<v:oval id="_x0000_s1031" style='position:absolute;left:1108901;top:1056767;
width:61472;height:11624;visibility:visible;mso-wrap-edited:f;
mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' fillcolor="black [0]"
stroked="f" strokecolor="black [0]" strokeweight="0" insetpen="t"
o:cliptowrap="t">
<v:fill opacity="58982f" color2="white [7]"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:oval><v:shape id="_x0000_s1032" type="#_x0000_t202" style='position:absolute;
left:1115344;top:1058870;width:48586;height:7418;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' filled="f"
fillcolor="white [7]" stroked="f" strokecolor="black [0]" strokeweight="0"
insetpen="t" o:cliptowrap="t">
<v:fill opacity="58982f" color2="white [7]"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.7pt' inset="2.85pt,2.85pt,2.85pt,2.85pt">
<div dir=ltr>
<p class=MsoTitle3><span lang=en-US style='font-size:24.0pt;font-family:
"Gill Sans MT";language:en-US'>Newsletter</span></p>
</div>
</v:textbox>
</v:shape></v:group><![endif]--><![if !vml]><span style='position:absolute;
z-index:6;left:192px;top:124px;width:546px;height:68px'><img width=546
height=68 src="index_files/image313.gif" v:shapes="_x0000_s1030 _x0000_s1031 _x0000_s1032"></span><![endif]><!--[if gte vml 1]><v:shape
id="_x0000_s1033" type="#_x0000_t202" style='position:absolute;left:42.51pt;
top:238.11pt;width:98.26pt;height:204.42pt;z-index:7;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' fillcolor="#e5e5e5"
strokecolor="#db1101" strokeweight="0" insetpen="t" o:cliptowrap="t">
<v:fill color2="white [7]"/>
<v:stroke dashstyle="longDash">
<o:left v:ext="view" dashstyle="longDashDot" color="#db1101" weight="0"
joinstyle="miter" insetpen="t"/>
<o:top v:ext="view" dashstyle="longDashDot" color="#db1101" weight="0"
joinstyle="miter" insetpen="t"/>
<o:right v:ext="view" dashstyle="longDashDot" color="#db1101" weight="0"
joinstyle="miter" insetpen="t"/>
<o:bottom v:ext="view" dashstyle="longDashDot" color="#db1101" weight="0"
joinstyle="miter" insetpen="t"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.7pt' inset="2.85pt,2.85pt,2.85pt,2.85pt">
<div dir=ltr>
</div>
</body>
</html>
我知道为了适应分辨率需要在perctange中定义元素，但是，由于这些代码已经定义了固定大小，有没有更简单的方法/任何方法使html代码适合所有大小的分辨率？ 谢谢，
答案 0 :(得分：0)
嗯，结果确实破坏了（如上所述），我不知道微软的VML，但你应该能够通过使用固定宽度的布局来适应每个分辨率。你问，这是怎么做到的？好吧，只需使用一个固定宽度的包装器，在你想要支持的最小分辨率附近（例如，600px应该提供有趣的覆盖量，尽管在这种情况下你通常会制作特定的样式，因为唯一的屏幕宽度为600px往往是平板电脑/手机等等。
这样的事情：
<!DOCTYPE HTML>
<html>
<head>
<title>Test</title>
<style>
* {
margin: 0;
padding: 0;
}
body,html {
width: 100%;
height: 100%;
}
div#site-wrapper {
width: 600px;
margin: 0 auto;
}
</style>
</head>
<body>
<!-- This area should be a 600px container centered in your page -->
<div id="site-wrapper">
<header>
<h1>My site</h1>
</header>
<section>
<header>
<h2>This is h2</h2>
</header>
<p>This is my section's content</p>
</section>
</div>
</body>
</html>