虽然视口很多,但是我们只用一个。就是理想视口。

单标签。

原本是高宽都300的。后来变成移动端后没有变成300/750,也不是300/1334。而是占据了一大半(300/375)。甚至375就满屏了。所以1px不是1物理像素。物理像素比是2。

下载下来,后续使用直接引用就好了。

可以改变默认的效果。

可以根据屏幕的大小自由伸缩。

小于320不能再缩了,大于980就不能再扩了。有伸缩的上下限。超过980了盒子大小就不变了,小于320了就盒子大小也不会变小,有滚动条可以体现没有变小。

app布局要使用到固定定位!

8% ,10% ,57%, 25%按百分比分出来的。先写宽度,高度后面在讲,因为也无能为力。

图片默认和文字的基线对齐,所以图片居中不了。所以要专门写一行代码让文字和图片居中对齐。

不用加a链接,到时候直接在li里用js加跳转,因为直接加a就太小了。

移动端和pc端最大的差别就是移动端会缩放。

等比缩放按钮。先等比例缩小或放大才能测量位置。这个位置才是准确的。

搜索模块要用固定定位,因为向下滑动的时候,还要保持在顶部。

一个大盒子里面有三个小盒子。

切的是盒子,没有切图片的圆角,所以要hidden大盒子。

图片默认有空隙,所以要去除空隙。

 流式布局只管宽度就好!!

50%, 25%, 25%

在左边加小边框就可以有竖线了。

底下模块大同小异。

前面顶部叉号的小bug。

移动web开发02的更多相关文章

  1. 2021年3月-第02阶段-前端基础-Flex 伸缩布局-移动WEB开发_flex布局

    移动web开发--flex布局 1.0 传统布局和flex布局对比 1.1 传统布局 兼容性好 布局繁琐 局限性,不能再移动端很好的布局 1.2 flex布局 操作方便,布局极其简单,移动端使用比较广 ...

  2. 2021年3月-第02阶段-前端基础-Flex 伸缩布局-移动WEB开发_流式布局

    移动web开发流式布局 1.0 移动端基础 1.1 浏览器现状 PC端常见浏览器:360浏览器.谷歌浏览器.火狐浏览器.QQ浏览器.百度浏览器.搜狗浏览器.IE浏览器. 移动端常见浏览器:UC浏览器, ...

  3. Web开发基本准则-55实录-Web访问安全

    Web开发工程师请阅读下面的前端开发准则,这是第一部分,强调了过去几年里我们注意到的Web工程师务须处理的Web访问安全基础点.尤其是一些从传统软件开发转入互联网开发的工程师,请仔细阅读,不要因为忽视 ...

  4. WEB开发中常用的正则表达式

    在计算机科学中,正则表达式用来描述或者匹配一系列符合某个句法规则的字符串的单个字符串.在WEB开发中,正则表达式通常用来检测.查找替换某些符合规则的字符串,如检测用户输入E-mai格式是否正确,采集符 ...

  5. WEB开发中常用的正则表达式集合

    在计算机科学中,正则表达式用来描述或者匹配一系列符合某个句法规则的字符串的单个字符串.在WEB开发中,正则表达式通常用来检测.查找替换某些符合规则的字符串,如检测用户输入E-mai格式是否正确,采集符 ...

  6. PHP. 01. C/S架构、B/S架构、服务器类型、服务器软件、HTTP协议/服务器、数据库、服务器web开发、PHP简介/常见语法、PHPheader()、 PHP_POST/GET数据获取和错误处理

    C/S架构 Client/Server 指客户端,服务器 架构的意思 优点:性能性高:可将一部分的计算工作放在客户端上,服务器只需处理出局即可   洁面炫酷,可使用更多系统提供的效果 缺点:更新软件需 ...

  7. 微信小程序开发 -- 02

    微信小程序开发 --02 微信小程序在开发中,难度系数不是很大,其中应用的技术也是web开发中常用的技术,虽然在微信开发者工具中的叫法与常见的web开发的叫法不太一样. 首先,在微信小程序开发中,代码 ...

  8. 【转】软件开发工具介绍之 6.Web开发工具

    [本文转自http://www.cnblogs.com/dusonchen/archive/2011/02/09/1739087.html ] 1.EditPlus 无论是编写xhtml页面,还是cs ...

  9. [python] python django web 开发 —— 15分钟送到会用(只能送你到这了)

    1.安装python环境 1.1 安装python包管理器: wget https://bootstrap.pypa.io/get-pip.py sudo python get-pip.py   1. ...

随机推荐

  1. c# 读取所有磁盘的剩余空间

    介绍: 有一个控制台命令是创建指定大小的空文件,因此我想制作一个一键填充剩余磁盘空间的坑人小程序. 想要填充剩余容量,就要先获取所有本地磁盘的剩余空间,这个程序就是用来做这个的. 项目类型为c#控制台 ...

  2. 『忘了再学』Shell基础 — 14、环境变量(二)

    目录 1.PS1变量的作用 2.PS1变量的查看 2.PS1可以支持的选项 3.PS1环境变量的配置 4.总结 提示: 在Linux系统中,环境变量分为两种.一种是用户自定义的环境变量,另一种是系统自 ...

  3. 811. Subdomain Visit Count - LeetCode

    Question 811. Subdomain Visit Count Example 1: Input: ["9001 discuss.leetcode.com"] Output ...

  4. # k8s-jenkins在kubernetes中持续部署

    k8s-jenkins在kubernetes中持续部署 1. k8s-jenkins在kubernetes中持续部署 Kubernetes Continuous Deploy插件:用于将资源配置部署到 ...

  5. mysql配置与存储引擎与字段类型与约束条件

    目录 字符编码与配置文件 存储引擎 创建表的完整语法 字段类型 整型 浮点型 字符类型 数字的含义 枚举与集合 日期类型 约束条件 字符编码与配置文件 在MySQL5.X系列中,显示的字符编码有多种, ...

  6. 【转载】k8s入坑之路(2)kubernetes架构详解

    每个微服务通过 Docker 进行发布,随着业务的发展,系统中遍布着各种各样的容器.于是,容器的资源调度,部署运行,扩容缩容就是我们要面临的问题. 基于 Kubernetes 作为容器集群的管理平台被 ...

  7. 13.LAMP架构介绍及配置

    LAMP架构介绍及配置 LAMP简介与概述 LAMP概述 LAMP架构是目前成熟的企业网站应用模式之一,指的是协同工作的一整套系统和相关软件,能够提供动态Web站点服务及其应用开发环境. LAMP是一 ...

  8. 密码学系列之:PKI的证书格式表示X.509

    目录 简介 一个证书的例子 X.509证书的后缀 .pem .cer, .crt, .der .p7b, .p7c .p12 .pfx 证书的层级结构和交叉认证 x.509证书的使用范围 总结 简介 ...

  9. JavaScript与Node.js一起打造一款聊天App

    聊天是我们人与人交流最直接的方式,互联网的加入使我们交流更加便捷.我们手机上的微信.QQ是我们手机必不可少的应用软件.那么,我们是否可以做一款聊天应用呢? 之前我自己闲着没事,研究过一些技术,做了一款 ...

  10. vue 封装弹窗组件注意

    父组件 <template> <div> <p @click="onDelete"> 打开 </p> <!-- 弹框 --&g ...