为什么bootstrap 图标不显示meta在手机上显示不全

你的浏览器禁用了JavaScript, 请开启后刷新浏览器获得更好的体验!
再不引入bootstrap样式的页面正常,引入在手机上就显示不全播放控制条
有人遇到过这个问题没?
求大神指导
要回复问题请先或
浏览: 1342
关注: 1 人在 SegmentFault,解决技术问题
每个月,我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
一线的工程师、著名开源项目的作者们,都在这里:
获取验证码
已有账号?
问题对人有帮助,内容完整,我也想知道答案
问题没有实际价值,缺少关键内容,没有改进余地
为什么加了meta标签还是在手机端还是不显示全部的页面
==============分割线===================可能我刚才的描述不是很具体,就是谷歌浏览器F12后换成手机能看到页面的全部。就比如一样不是移动端的页面 只要能看到网页的全部内容就行。现在能看到的只是一块。
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
你把这个meta标签去掉就行了,你没有对手机做适配就不需要加这个&meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" class="__web-inspector-hide-shortcut__"&
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
这段CSS错了。
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
width:100%
不要把所有的width都用px值写死了,hack设置根元素的px,然后其他的宽度单位使用rem
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
改变body值不行 - -。
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
@media only screen and (max-width: 320px){html{font-size:12} }等用媒体查询条件加rem去重新适配你这个网站吧.看看这个文章:
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
.container {
width: 1200
}这里也错了整个样式就是pc版本的。你要把所有px单位的宽度全修改成百分百或者rem的
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
这个静态页面几乎所有的width都是大于1200px,在手机显示全才怪呢,先在chrome上模拟手机调试完之后再用手机去看看,改的地方感觉还不少。一家之言,仅供参考
同步到新浪微博
分享到微博?
关闭理由:
删除理由:
忽略理由:
推广(招聘、广告、SEO 等)方面的内容
与已有问题重复(请编辑该提问指向已有相同问题)
答非所问,不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因(请补充说明)
我要该,理由是:在 SegmentFault,解决技术问题
每个月,我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
一线的工程师、著名开源项目的作者们,都在这里:
获取验证码
已有账号?
问题对人有帮助,内容完整,我也想知道答案
问题没有实际价值,缺少关键内容,没有改进余地
为什么加了meta标签还是在手机端还是不显示全部的页面
==============分割线===================可能我刚才的描述不是很具体,就是谷歌浏览器F12后换成手机能看到页面的全部。就比如一样不是移动端的页面 只要能看到网页的全部内容就行。现在能看到的只是一块。
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
.container {
width: 1200
}这里也错了整个样式就是pc版本的。你要把所有px单位的宽度全修改成百分百或者rem的
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
你把这个meta标签去掉就行了,你没有对手机做适配就不需要加这个&meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" class="__web-inspector-hide-shortcut__"&
分享到微博?
关闭理由:
删除理由:
忽略理由:
推广(招聘、广告、SEO 等)方面的内容
与已有问题重复(请编辑该提问指向已有相同问题)
答非所问,不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因(请补充说明)
我要该,理由是:怎样让bootstrap设计的页面在手机端也能响应式自适应
怎样让bootstrap设计的页面不仅在电脑浏览器是响应式在手机端也是响应式呢?
也就是电脑端不同分辨率下的浏览效果跟相应分辨率下的手机端浏览效果是一样的呢?
闲话少说,直接上图看效果:
在用bootstrap设计好页面,并在火狐浏览器上进行调试,效果图如下:
但是在手机端浏览的时候发现整个页面被缩小的很小,连文字都看不清:
为什么会这样呢?
为什么bootstrap设计出来的页面样式虽然都一样,但是在手机端
显示的只是整个页面都缩小而不是响应式的呢?
后来才发现凡是bootstrap设计的页面都带有标签头:
&&meta name="viewport"
content="width=device-width, initial-scale=1"&
只要每个页面都加上这样的标签头,电脑端和手机端的效果就会保持一致,加了标签头
的效果图如下:
手机端和电脑端相同分辨率下的效果就保持一致了,
因为bootstrap设计的页面首先考虑的是移动端,
所以我们设计的响应式布局的页面
能很好的适应移动端、电脑端、平板等各种不同分辨率的设备.
已投稿到:
以上网友发言只代表其个人观点,不代表新浪网的观点或立场。

我要回帖

更多关于 bootstrap modal 显示 的文章

 

随机推荐