因此，当我缩小浏览器窗口时，我的图像和框会响应浏览器窗口的大小，但文本不会。我尝试了很多不同的方法：百分比、ems和媒体查询，但似乎都不起作用。也许我放错了？
下面是CSS的代码：
body {
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
font-size:12px;
background: #394BA0;
color:#C180E4;
border-color:#88C6ED;
}
#wrapper {
width:62.7%;
margin:0px auto;
border:1px solid #bbb;
padding:10px;
height: 1199px;
}
#header {
border:1px solid #bbb;
height:100px;
padding:10px;
}
#content-left {
width: 21%;
height: 61.4%;
border:1px solid #bbb;
float: left;
margin-top: 0.4%;
}
#content-main {
float: center;
width: 77%;
height: 61.3%;
border:1px solid #bbb;
margin-top: 0.5%;
margin-left:23%;
word-wrap: break-word;
}
#content-box1 {
width: 49%;
height: 26%;
margin-top: 1%;
float: left;
}
#content-box2 {
width: 49%;
height: 26%;
border:0px solid #bbb;
margin-top: 2%;
margin-left:51%;
float: center;
}
这是我主页的代码：
<html>
<head>
<link rel="stylesheet" type="text/css" href="Responsive Web design CSS.css">
<style>
a:link {color:#C180E4; font-style: normal;} /* unvisited link */
h2 {text-align:center}
h3 {text-align:center}
h3 {margin-top:50%}
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<h2><font size="6">Locked Down Data</font></h2>
</div>
<div id="content-box1">
<p><img src="download.jpg" width="99%" height="94%" border="1px" alt="picture1"></p>
</div>
<div id="content-box2">
<p><img src="foto-locked-down-iphone.jpg" width="99%" height="94%" border="1px" alt="picture2"></p>
</div>
<div id="content-left">
<h1><font size="5"> Menu</font></h1>
<p><font size="4"><a href="Home Page.html"> -Home</a></font></p>
<p><font size="4"><a href="Page 2 - Threats.html"> -Threats</a></font></p>
<p><font size="4"><a href="Page 3 - Protection.html"> -Protection</a></font></p>
<p><font size="4"><a href="Page 4 - Pracitcal Application.html"> -Practical Application</a></font></p>
<p><font size="4"><a href="Page 5 - Contact.html"> -Contact</a></font></p>
<h3><img src="it-security.png" width="79%" height="30%" alt="picture2" /></h3>
</div>
<div id="content-main">
Aenean ac turpis lectus. Vestibulum vel nulla eget libero tristique egestas venenatis id est. Mauris dictum ac nulla ullamcorper accumsan. Donec ipsum metus, molestie sit amet pretium a, adipiscing ac tellus. Nulla eu ullamcorper enim. Aliquam adipiscing facilisis erat ultrices aliquam. Nam eu libero est. Mauris semper urna rutrum, suscipit erat ut, varius lectus. Aenean ut orci lobortis ante ultricies facilisis. Curabitur tempus orci et eleifend fermentum. Etiam pharetra mauris sed consequat commodo. Quisque at lacus non massa consequat consequat mattis sit amet elit. Aliquam in tellus faucibus, aliquet mi at, faucibus neque.
<p><iframe width="56%" height="31%" src="http://www.youtube.com/embed/W90gNMoeY6c" frameborder="0" allowfullscreen></iframe></p>
</div>
</body>
</html>
最佳答案
FlowType库（http://simplefocus.com/flowtype/）可能就是您要找的。