手机端的页面怎么开发,和web html有区别吗
发布网友
发布时间：2022-04-23 15:48
共2个回答
热心网友
时间：2022-04-20 04:56
两者之间没有区别。
有许多方法可以在手机上开发网页。 目前，html5的发展还不够平衡，导致主要浏览器对h5的支持不尽人意。 但是，其添加了@media属性（属于css3，html5和css3的名称在这里没有严格区分，实际上，是两种不同的技术）。
从那时起，网页创建可以根据用户所持有的设备的像素宽度来识别是否正在使用移动电话，从而在用户正在使用移动设备时下载移动页面。 但是，其存在某些缺点。 在这个阶段，手机的标准还很不规范。
扩展资料：
目前现阶段的手机网页开发，主要的手段是：
其一，在meta标签中添加关于像素宽度的*语句，然后实现css的相对宽度。 但是，界面会显得杂乱无章，因此很少使用此方法。
其二，这种方法是最常见的。 网站页面分为两个部分，分别面向计算机和手机。 当用户请求页面时，标题信息用于确定其是否是计算机浏览器，然后针对不同的请求发送不同的网页文件。 这样的网页通常不是静态的。
另外，开发移动网页时，可以使用Chrome的开发人员工具。 Chrome开发人员工具可以模拟手机页面的开发，还可以模拟许多设备，方便用户开发。
热心网友
时间：2022-04-20 06:14
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv = "X-UA-Compatible" content = "IE=edge,
chrome=1" />
<meta name="viewport" content="width=device-width,
minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<meta name="Description" content=""/>
<meta name="keywords" content=""/>
<title>模板</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js">
</script>
</head>
<body>
<div id="header"></div>
<div id="content"></div>
<div id="footer"></div>
</body>
</html>
这是一个通用的模板，
手机页面需要添加这行代码<meta name="viewport" content="width=device-width,
minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
pc版可以用他做自适应页面。
@media (min-width:320px) and (max-width:750px) {#header,#content,#footer{width: 100%;}
}
这个是在屏幕宽度在320~750的时候使用这个里面的样式，他就可以在手机版的时候显示为手机样式。
总的来说PC版和手机版用的代码是一样的，不过就是手机版的做了一个判断屏幕宽度新应用了一套样式。
