怎么修改网站的css让它适应手机端？
公司现在的官网是适应各种屏幕大小的，但是手机浏览还是网页的界面，怎么改让它能在手机端正常显示？修改css还是js？有什么具体思路吗...
公司现在的官网是适应各种屏幕大小的，但是手机浏览还是网页的界面，怎么改让它能在手机端正常显示？
修改css还是js？有什么具体思路吗 展开
修改css还是js？有什么具体思路吗 展开
4个回答
展开全部
需要准备的材料分别有：电脑、浏览器、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
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
主要就是百分比宽度，用不用楼上说的东西都无所谓，不会的话现学bootstrap估计能做出来得半年以后了。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
修改css，改成响应式的设计就行了
追问
是要重写一套对应手机页面的css吗？要用到mobile.js吗？
追答
你可以使用媒体查询来做，或者使用bootstrap框架来写
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
