网页手机
使用bootstrap 如何做自适应的网页，比如一个大图如何适应手机端和pc端
可以用media query媒体查询来设置不同分辨率下的不同css样式/* 超小屏幕（手机，小于 768px） *//* 没有任何媒体查询相关的代码，因为这在 Bootstrap 中是默认的（还记得 Bootstrap 是移动设备优先的吗？） *//* 小屏幕（平板，大于等于 768px） */@media (min-width: @screen-sm-min) { ... }/* 中等屏幕（桌面显示器，大于等于 992px） */@media (min-width: @screen-md-min) { ... }/* 大屏幕（大桌面显示器，大于等于 1200px） */@media (min-width: @screen-lg-min) { ... }给你来一段样例，你看看12345678910111213141516171819202122232425@media(min-width: 768px) { .ipad { display: none; } .mobile { display: none; } .pc { display: block; } .row { margin-left: 0; margin-right: 0; } .home-bg { //margin: 0; background: url(asset-path("common/home_big3.jpg")) center no-repeat; width: 100%; height: 500px; background-size: cover; }}123456789101112131415161718192021222324@media (max-width: 767px) { .ipad { display: block; } .mobile { display: none; } .pc { display: none; } .home-bg { background: url(asset_path("common/home_1024.jpg")); background-position: center center; background-repeat: no-repeat; background-size: cover; //height: 100%; } }123456789101112131415161718192021@media(max-width: 480px) { .ipad { display: none; } .pc { display:none; } .mobile { display: block; } .home-bg { background: url(asset_path("common/home_640.jpg")); background-position: center center; background-repeat: no-repeat; background-size: cover; height: 600px; } }想必你能理解我的意思
怎么把淘宝店的宝贝详情页同步上传到手机端
1、请登录http://wuxian.taobao.com进入无线运营中心，点击立即进入。可以分别对手机淘宝与手机天猫客户端进行装修。2、一键极速发布手机端宝贝详情页（即描述）1.电脑端图文描述编辑框底部加入“生成手机版宝贝描述”按钮，卖家点击此按钮后系统根据卖家已编辑完的电脑端图文描述自动进行适配生成手机版宝贝描述，如下图所示2.在手机端宝贝描述编辑框中同样加入“导入电脑端宝贝描述”功能，卖家可点击此处导入电脑端宝贝描述并进行自动适配生成手机端宝贝描述3.针对于之前已发布过手机端图文详情的卖家在使用此功能时请注意如下内容
手机前端页面尺寸
iPhone4/iPhone4s 320 * 372 / 320 * 441 (已隐藏URL与状态栏)iPhone5/iPhone5s 320 * 460 / 320 * 529 (已隐藏URL与状态栏)Note2 360 * 567 (未隐藏URL与状态栏)iPad 3/4 768*928 (未隐藏URL与状态栏)GALAXY SIII 360 * 567 (未隐藏URL与状态栏)米2A 360 *567 (未隐藏URL与状态栏)HTC G10 320 * 460<meta name="viewport"网页手机wap2.0网页head加入面条元标签iPhone浏览器页面原始显示并允许缩放 <meta name="viewport"content="width=device-width, initial-scale=1.0, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> width - viewport宽度 height -viewport高度 initial-scale - 初始缩放比例 minimum-scale -允许用户缩放比例 maximum-scale -允许用户缩放比例 user-scalable - 用户否手缩放参考：http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/quick-tip-dont-forget-the-viewport-meta-tag/、网页手机wap2.0网页head加入面条元标签iPhone浏览器页面原始显示并允许缩放<meta name="viewport"content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">其： width - viewport宽度 height - viewport高度 initial-scale -初始缩放比例minimum-scale - 允许用户缩放比例 maximum-scale - 允许用户缩放比例user-scalable -用户否手缩放c二、关于meta详细介绍请参考三、文关于Meta例详细介绍 原文址3. Meta元素视区 默认情况iPhoneSafari象屏幕桌面浏览器显示页面宽度达980像素缩内容适应iPhone屏幕用户iPhone看页面觉字体比较比较模糊必须要放才能看真切于普通Web页面似乎接受于用应用程序没几能够受 幸运使用特殊Meta元素视区进行纠：<metaname="viewport" content="width=device-width"/> 元素通知浏览器使用设备宽度作视区宽度默认980像素我看看两同例 例3(链接：http://www.sitepoint.com/examples/iphone-development-12tips/no-viewport.html)显示简单段落元素没Meta元素视区字体点模糊iPhone运行实际情况图所示图 1 视区显示效 例4(链接：http://www.sitepoint.com/examples/iphone-development-12tips/viewport.html)包括视区元素现设备宽度320像素字体比前例更清晰iPhone运行实际情况图所示图 2 视区显示效 另外手设置device-width值例假设博客页面宽度750像素桌面屏幕佳800x600像素例5(链接：http://www.sitepoint.com/examples/iphone-development-12tips/fixed750.html)显示删减版本iPhone浏览看980像素剩空间都填充白色 消除额外空间使用meta元素视区宽度设780像素：<metaname="viewport" content="width=780"/> 例6(链接：http://www.sitepoint.com/examples/iphone-development-12tips/fixed750-viewport.html)显示meta元素视区布局固定效 Meta元素视区内容包括逗号隔值initial-scale –用户初看页面放级别于Web应用程序见设置：<metaname="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/> 元素设置宽度设备宽度禁止用户放缩
