![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
移动web开发
東三城
寻找光 追随光 成为光 发散光
展开
-
前端与移动开发----移动web开发----CSS高级部分(animation属性)
CSS高级部分☞ animation属性animation: 1. 动画的执行,不需要有用户的动作 2. animation动画的执行次数,是我们可以人为的控制的transition: 1. transition动画的执行,需要有用户动作 2. transition动画的执行次数,依赖于用户的动作是否在进行【有用户的动作就执行,没有就结束】语法:@keyframes 动画序列名称 { from { 开始状态 } to { 结束状态 }}原创 2020-11-08 22:15:25 · 187 阅读 · 0 评论 -
前端与移动开发----移动web开发----CSS高级部分(2D转换,3D转换)
CSS高级部分☞核心知识点1. 2D转化及相关属性【重要】[复合属性: 由多个属性组成]2. 3D转化及相关属性【重要】[复合属性]☞2D转化[复合属性]1. 2D转化能够让我们干什么?◇2D转化可以让我们改变元素位置【位移】◇2D转化可以让页面中的元素旋转【旋转】◇2D转化可以改变页面中元素的大小【缩放】2. 2D转化位移语法: transform: translate(x, y);备注: x 代表元素在水平方向的位移 y 代表元素在垂直方向的位移例如:原创 2020-11-06 22:00:22 · 271 阅读 · 0 评论 -
前端与移动开发----移动web开发----Rem适配
Rem适配今天内容的前提:今天的知识点是我们以后在工作中移动端项目开发最常用的,而且要配合我们前面所学的知识点(less + 媒体查询)今天的知识点听懂不难,应用也不难,就是公式总结的时候稍微有一点点复杂.1. 回顾整个移动端学哪些知识流式布局(百分布局) : 实现网页中布局效果的伸缩布局(弹性布局): 实现网页中布局效果的响应式布局(媒体查询): 实现网页布局的,一个网页在不同设备中布局效果有差异Rem: 不是布局, rem是在操作网页中最后的适配的(解决同一个元素在原创 2020-11-05 22:15:08 · 163 阅读 · 0 评论 -
前端与移动开发----移动web开发----响应式布局+boostrap框架介绍(内附响应式布局案例---微金所)
响应式布局+boostrap框架介绍核心知识点媒体查询boostrap框架栅格系统媒体查询概念媒体查询可以让我们根据设备显示器的特性(如视口宽度、屏幕比例、设备方向:横向或纵向)为其设定CSS样式,媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成。媒体查询中可用于检测的媒体特性有 width 、 height 和 color (等)。使用媒体查询,可以在不改变页面内容的情况下,为特定的一些输出设备定制显示效果。组成媒体类型all (所有的设备)prin原创 2020-11-03 21:39:39 · 310 阅读 · 1 评论 -
前端与移动开发----移动web开发----LESS介绍+媒体查询(内附综合案例----小兔鲜)
LESS介绍+媒体查询核心知识点1. less2. 媒体查询学习目标1. 能够掌握less基本语法2. 能够掌握媒体查询基本语法Less介绍维护CSS的弊端CSS本质上不是一门语言,是一个简单的样式表.代码维护相对老套,不够灵活.LESS介绍☞LESS预处理器: 依然使用CSS语法,引入了变量,混合,运算, 嵌套等功能,大大简化了 CSS 的编写,并且 降低了 CSS 的维护成本☞常见的CSS预处理器: Less | SASS 等https://less原创 2020-11-02 22:06:10 · 387 阅读 · 3 评论 -
前端与移动开发----移动web开发----伸缩布局
伸缩布局1. 什么是网页布局?在网页中摆放盒子的过程 ----> 布局2. 如何摆放盒子?让盒子一行显示 用 浮动让盒子压着另外一个盒子 用 定位如果要移动盒子的位置可以通过 margin 和 padding3. 如果在网页中遇到如下布局效果该怎么办?解决思路: 1. 先准备三个盒子 2. 让三个盒子浮动 3. 第一个盒子左浮动 最后一个盒子右浮动 中间盒子居中显示4. 可以通过伸缩布局的方式快速的解决以上问题给父元素设置 dis原创 2020-11-01 21:54:57 · 432 阅读 · 0 评论 -
前端与移动开发----移动web开发----流式布局(内附流式布局案例---京东)
移动web流式布局☞移动端基础概念介绍【了解】1.知识点-移动设备-屏幕尺寸屏幕尺寸: 代表的是移动设备屏幕对角线的长度 ,单位是 寸2.知识点-移动设备-物理分辨率物理分辨率: 代表的就是当前设备的宽度和高度 单位是 px (不能修改的)[记住一些常用的分辨率]屏幕分辨率: 代表的移动设备屏幕的分辨率(衡量设备的画质的高低) [了解]记住一些常见的移动设备分辨率:iphone4 : 320px 480pxiphone5 : 320px 568pxi原创 2020-10-30 22:07:31 · 565 阅读 · 0 评论