需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<head>标签中，输入meta代码：<meta name="viewport" content="width=device-width, initial-scale=1">。
3、浏览器运行index.html页面，此时PC端的网页在移动端上也能自动适配。
两种思路：
一、响应式网站（PC、PAD、手机等自适应）
在HTML源文件中的头部head加入：
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">具体meta标签的含义自己可以查一下，学习一下，根据自己的情况设定。给对应的屏幕尺寸写单独的代码css样式表里写：@media screen and (min-width:640px){这里面写手机端标签的代码，例如，body{font-size:18px}， banner{width:640px}}，根据自己的需求调整下字体大小，尺寸等。
注：@media标签要放在PC样式的下方，不然模式识别前面的标签会导致PC也显示这个样式。
响应式网站用框架比较方便，对于各个屏幕的大小需要做之前好好规划，应用百分比让网站自适应，缺点但不利于SEO，显示内容与PC、PAD基本都是一致的内容。
二、用JS识别做网站跳转
这种方法比较灵活，可以做一套自己想要的手机网站，比如做成APP的形式
1.加入js代码控制网站跳转：
var browser_class = navigator.userAgent;console.log(browser_class);
var browser_class_name1 = browser_class.match("Mobile");
var browser_class_name2 = browser_class.match("mobile");
var location_url = window.location.href;
console.log(location_url);
if (browser_class_name1 != null || browser_class_name2 != null){
if (location_url.match("wap") == null){
window.location.href="http://m.baidu.com/";
}
} else
{
if (location_url.match("3g") != null || location_url.match("wap") != null){
window.location.href="http://m.baidu.com/";
}
}
2.单独做一个手机网站，域名指向m.baidu.com
这种方式比较灵活，PC网站已经做好了，改响应式比较费劲，这种方法也挺好，也利于SEO
本回答被提问者和网友采纳是要重写一套对应手机页面的css吗？要用到mobile.js吗？
追答你可以使用媒体查询来做，或者使用bootstrap框架来写
怎样让手机版网页自适应手机屏幕宽度?
在手机上不能固定宽度，要按百分比写页面宽度。才能自适应设备。主要是这两点，当然细节上面还有很多和PC端不一样的地方。指向文件错误，比如你的网页文件在A，但是你却指向了B。你把指向的文件放到网页文件内在试试。如果下载下来的图片大小规格完全一样的话，在photoshop中设置一个动作，就能批量处理了。
怎么修改网站的css让它适应手机端?
1、首先，打开html编辑器，新建html文件，例如：index.html。2、在index.html中的标签中，输入meta代码：。3、浏览器运行index.html页面，此时PC端的网页在移动端上也能自动适配。
如何添加CSS让页面自适应手机屏幕
首先，在网页代码的头部，加入一行viewport标签viewport是网页默认的宽度和高度，上面这行代码的意思是，网页宽度默认等于屏幕宽度（width=device-width），原始缩放比例（initial-scale=1）为1.0，即网页初始大小占屏幕面积的100%。即让viewport的宽度等于物理设备上的真实分辨率，不允许用户缩放。其次：网页宽...
如何让网站自适应如何让网站自适应手机
1.首先打开手机上的【设置】，可以在桌面上找到设置并点击进入；2.然后进入设置之后，上下滑动页面，找到【显示】设置功能；3.接着点击进入显示设置之后，找到【屏幕刷新率】功能进入设置手机刷新率，此时可以看到当前手机的刷新率；4.最后，选择需要使用的屏幕刷新率【120帧】，点击即可应用，这样王者荣耀1...
pc网站怎么转变成手机端浏览样式?
PC网站转变为手机端浏览样式，主要有以下几种方法：一、建设对应的移动网站界面，相当于重新写一个网站，然后通过站长平台移动适配或者js代码进行识别设备跳转到对应的网站界面；二、自适应网站和响应式网站，就是在pc端网站的css样式里面设置多一层样式（移动端样式），然后在使用移动端设备访问时，展示对应...
如何让网站自适应手机
然后加载相应的CSS文件。同一个CSS文件中，也可以根据不同的屏幕分辨率，选择应用不同的CSS规则。其次，除了布局和文本，”自适应网页设计”还必须实现图片的自动缩放。有条件的话，最好还是根据不同大小的屏幕，加载不同分辨率的图片。有很多方法可以做到这一条，服务器端和客户端都可以实现。
css怎么设置让网页在手机上显示大字体
可以通过识别浏览窗体属性，如果是手机，那么就把font size加大 第二种方法就是，通过自适应的方式，只要是手机端的，都把它字体加大
HTML页面如何自适应手机端,自动放大或者缩小?
用CSS3 @media 查询 也叫“媒体查询”；语法：.aaa{width:1200px;} \/\/正常样式 \/\/下面是分辨率最小为300px，最大分辨率为1024px的样式 media screen and (min-width: 300px) and (max-width:1024px) {.aaa{width:375px;} } 可以参考：菜鸟教程CSS3 @media 查询 ...
已经做好的pc版网页,如何转成手机端的?
white"> 注意：现有网站直接改成移动端虽说理论上可行，但如果不是一开始就相对设计较为完善的话，重新基本就是要重做UI部分，连带后端也要做相应的调整。
如何用@media做手机自适应
先看下面的代码,这是从bootstrap中遍历出来的，min-width来确认分别是 768、992、1200。当然了过去也有些设备宽度是600 480的，哪些小分辨率的我们都归类为小于767的。为什么是小于767而不是768呢，那是因为在css中@media (min-width: 768px)表示最小是768也就是>=768，这里有等于，所以我们判断更...
