移动端
关注
分享
扫一扫
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 · 307 阅读 · 2 评论 -
移动端 第十一章动画
动画的属性: animation animation-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 · 293 阅读 · 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 · 160 阅读 · 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 · 176 阅读 · 0 评论 -
移动端 第六章 背景渐变
背景渐变： 分为2种： 线性渐变 linear 径向渐变 radial background:-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 · 194 阅读 · 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 · 451 阅读 · 0 评论 -
移动端第六章盒子模型
盒子模型 1：原来的盒子，添加border,padding都可以让盒子本身变大，为了解决这个问题，css3推出了新的盒子模型 2：box-sizing:content-box,border-box content-box是默认值 计算方式 padding+border+width border-box 盒子大小始终是元素width 例子: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <原创 2020-10-13 14:17:26 · 228 阅读 · 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 · 171 阅读 · 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 · 157 阅读 · 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 · 153 阅读 · 0 评论 -
移动端 第二章新增H5标签
标签名 标签 案例 页面头部标签 header 页脚底部标签 footer 导航 nav <nav> <a href=''>首页</a> <a href=''>首页</a> <a href=''>首页</a> </nav> 划分区域 sec.原创 2020-10-13 14:01:21 · 154 阅读 · 0 评论 -
移动端第一章课程概要
1：html5是什么？ HTML5 技术结合了 HTML4.01 的相关标准并革新，符合现代网络发展要求， 在 2008 年正式发布。HTML5 由不同的技术构成，其在互联网中得到了非常广泛的应用， 提供更多增强网络应用的标准机。与传统的技术相比，HTML5 的语法特征更加明显， 并且结合了 SVG 的内容。这些内容在网页中使用可以更加便捷地处理多媒体内容， 而且 HTML5中还结合了其他元素，对原有的功能进行调整和修改，进行标准化工作。 HTML5 在 2012 年已形成了稳定的版本。 **一句话概括，h原创 2020-10-05 20:01:14 · 276 阅读 · 0 评论