
移动端开发
一麻袋小猫
Put the glass down。
展开
-
移动端开发(rem+媒体查询+less技术、rem+flexible.js)
rem+媒体查询+less技术首先我们选一套标准尺寸 750为准我们用屏幕尺寸 除以 我们划分的份数 得到了 html 里面的文字大小 但是我们知道不同屏幕下得到的文字大小是不一样的。页面元素的rem值 = 页面元素在 750 像素下的px值 / html 里面的文字大小**************normalize.css ——>移动端页面初识化文件common.less文...原创 2020-02-17 13:12:36 · 489 阅读 · 0 评论 -
移动端开发案例(Bootstrap布局,响应式开发)
注意事项:1.屏幕缩放发现中屏幕和大屏幕布局是一致的,因此我们列定义为col-md- 就可以了,md是大于等于970px以上的。2.先布局PC端布局,最后根据实际需求在修改小屏幕和超小屏幕的特殊布局样式。3.Bootstrap 的字体图标,默认加一个before,所以要设置字体图标样式,要用before设置4.图片默认与文字的基线对齐,所以用 vertical-align:middle...原创 2020-02-16 13:19:01 · 2310 阅读 · 0 评论 -
移动端开发案例(flex布局)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no,maximum-scale...原创 2020-02-14 14:57:16 · 352 阅读 · 0 评论 -
移动端开发案例(流式布局)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0,maximum-scale...原创 2020-02-12 18:26:56 · 396 阅读 · 0 评论 -
移动端开发(流式、flex、rem、Bootstrap)
移动端主流方案1.单独制作移动端页面(主流)通常根据设备判断,经常在网址域名前面加m(moble)可以打开移动端,如果是移动设备打开,则跳到移动端页面京东手机版淘宝触屏版苏宁易购手机版2.响应式页面兼容移动端(其次)通过判断屏幕宽度来改变样式,以适应不同终端缺点:制作麻烦,需要花费很大精力去调兼容性问题三星手机官网3.移动端浏览器移动端浏览器基本以webkit内核为主,因此我...原创 2020-02-12 11:42:22 · 706 阅读 · 0 评论 -
Flex伸缩布局
移动布局基础移动端浏览器我们主要对webkit内核进行兼容我们现在开发的移动端主要针对手机端开发现在移动端碎片化比较严重,分辨率和屏幕尺寸大小不一视口就是浏览器显示页面内容的屏幕区域。视口可以分为布局视口、视觉视口、理想视口其中最常用的就是理想视口布局视口:在早期手机还能打电话和收短信的时代。厂商萌生了把PC端的网页放在手机上显示的想法,于是就设置了一个布局视口。iSO,Andro...原创 2020-02-11 18:22:43 · 159 阅读 · 0 评论