题目：
在线考试系统开发完成后，既可以在电脑的浏览器上答题，也可以在手机等移动设备的浏览器上答题。当网站在局域网内上线后，手机可以通过WIFI连接到局域网中访问。需要注意的是，如果网页按照传统的方式设计，在手机浏览器中访问可能会出现排版问题，为此可以将网页设计成响应式布局。接下来请动手实现在线考试系统的手机端答题，通过响应式布局使页面符合手机端的浏览体验。
答案：
1、在HTML中的<head>中添加viewport：
<meta name="viewport" content="width=device-width, initial-scale=1.0">
2、编辑css/style.css，添加响应式代码：
/*响应式*/
@media screen and (max-width:600px) {
.main{width:100%;}
如何运行php项目
.question-top{padding-left:10px;padding-right:10px;text-align:center;}
.question-title{float:none;}
.question-nav{float:none;display:inline-block;padding-right:10px;}
.question-wrap{margin-left:10px;margin-right:10px;}
.total-table{width:95%;}
}
@media screen and (max-width:420px) {
.question-nav a{padding:6px 8px;}
}
@media screen and (max-width:345px) {
.question-nav a{margin-top:5px;margin-bottom:5px;}
}
3、在手机浏览器中访问，运行结果如图所示。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。