移动端
关注
分享
扫一扫
starry__sty
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
移动端 第十二章 3d
transform-origin:基点(旋转中心点)定义x轴的写法 :left/center/right/length/%定义Y轴的写法 :top/center/bottom/20px/50%transform-origin:x y;css:<style type="text/css"> div{ width: 200px; height: 200px; background: red; margin: 100px auto; transi原创 2020-11-02 09:19:46 · 289 阅读 · 2 评论 -
移动端 第十一章动画
动画的属性:animationanimation-name:动画的名字animation-duration:动画完成一个周期所花费的时间(秒/毫秒)animation-timing-function:动画的速度曲线(linear ease ease-in ease-out ease-in-out 贝塞尔曲线)animation-delay:动画何时开始animation-iteration-count:动画被播放的次数 number/infinite(无限循环) animation-dire原创 2020-11-01 19:33:37 · 278 阅读 · 3 评论 -
移动端 第十章 过渡
transition:过渡过渡时间transition-duration: 3s;过渡属性(定义宽还是高)transition-property: all;过渡函数(运动的方式)transition-timing-function: ease;过渡延迟时间transition-delay: 4s;运动方式(贝塞尔曲线)ease:开始和结束慢 中间快 相当于cubic-bezier(0.25, 0.1, 0.25,1)ease-in:(加速) 开始慢 相当于cubic-bezie..原创 2020-10-25 19:53:00 · 149 阅读 · 0 评论 -
移动端 第九章变形
transform:变换/变形translate:移动translate(X px,Y px);rotate:旋转/负值就是倒转;rotate(-360deg); scale:缩放scale(x,y)skew:扭曲skew(x deg,y deg)移动<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <sty原创 2020-10-25 19:51:07 · 165 阅读 · 0 评论 -
移动端 第六章 背景渐变
背景渐变：分为2种：线性渐变 linear径向渐变 radialbackground:-webkit-linear-gradient(top,yellow,blue);background:-webkit-linear-gradient(left,yellow,blue,green,pink);background:-webkit-linear-gradient(top right,yellow,blue,green,pink);background:-webkit-linear-g原创 2020-10-25 19:47:28 · 183 阅读 · 0 评论 -
移动端第七章 字体
文字阴影text-shadow：x y blur color, …参数x 横向偏移y 纵向偏移blur 模糊距离color 阴影颜色文本阴影如果加很多层，会很卡很卡很卡<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> p{ font-si原创 2020-10-25 19:44:49 · 441 阅读 · 0 评论 -
移动端第六章盒子模型
盒子模型1：原来的盒子，添加border,padding都可以让盒子本身变大，为了解决这个问题，css3推出了新的盒子模型2：box-sizing:content-box,border-boxcontent-box是默认值 计算方式 padding+border+widthborder-box 盒子大小始终是元素width例子:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <原创 2020-10-13 14:17:26 · 216 阅读 · 0 评论 -
移动端第五章 选择器
新增选择器：选择器： 例子 描述element>element div>p 选择 <div>的 子元素<p> 。element+element div+p 选择在 <div> 元素之后的相邻的 <p> 元素。element~element div~p 选择在 <div> 元素之后的所有 <p> 元素。属性伪类：[attribute]原创 2020-10-13 14:11:36 · 156 阅读 · 0 评论 -
移动端第四章音频视频
audio 音频音频属性controls 控制面板src 路径loop 循环次数 autoplay 自动播放muted 静音播放video 视频视频属性width 宽height 高poster 指定播放开始画面source 浏览器对视频的格式要求不一样，为了兼容浏览器，所以用到source标签source标签可以让浏览器自己选择可以播放的视频格式举例：<video width="800" height=""> //source指的是数据来原创 2020-10-13 14:06:49 · 145 阅读 · 0 评论 -
移动端第三章新增表单控件
表单中新增的控件(type属性)email: 提交表单时检测值是否是一个电子邮件格式url: 提交表单时检测值是否是一个url格式date: 年-月-日格式的控件time: 时:分格式的控件datetime: 年-月-日 时:分 格式的控件（UTC时间）datetime-local: 年-月-日 时:分 格式的控件（本地时间）month: 年-月格式的控件week: 年-周数格式的控件number: 数字输入框<input type="number" name="" id="" v原创 2020-10-13 14:04:30 · 133 阅读 · 0 评论 -
移动端 第二章新增H5标签
标签名 标签 案例 页面头部标签 header 页脚底部标签 footer 导航 nav <nav> <a href=''>首页</a> <a href=''>首页</a> <a href=''>首页</a> </nav> 划分区域 sec.原创 2020-10-13 14:01:21 · 144 阅读 · 0 评论 -
移动端第一章课程概要
1：html5是什么？HTML5 技术结合了 HTML4.01 的相关标准并革新，符合现代网络发展要求，在 2008 年正式发布。HTML5 由不同的技术构成，其在互联网中得到了非常广泛的应用，提供更多增强网络应用的标准机。与传统的技术相比，HTML5 的语法特征更加明显，并且结合了 SVG 的内容。这些内容在网页中使用可以更加便捷地处理多媒体内容，而且 HTML5中还结合了其他元素，对原有的功能进行调整和修改，进行标准化工作。HTML5 在 2012 年已形成了稳定的版本。**一句话概括，h原创 2020-10-05 20:01:14 · 263 阅读 · 0 评论