![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML5
文章平均质量分 76
jwllwj_2018
start:2016.7-2016.12 ~~~记录
展开
-
html5相关笔记(一)
0.推荐开发技术资料网站:http://www.shouce.ren/,里面包含了各种开发技术手册、开发工具插件、各种技术书籍等等。1 网页开发方式上的两个层次:◆HTML4.1 ◇结构:html4.0 ◇样式:css css2 ◇行为:js◆HTML5 ◇结构:html5 ◇样式:css3 ◇行为:js API 有所增强 如 地理定位 web存储 拖拽 重力感应 硬件访问等2.HTML5狭义的概...原创 2018-06-11 14:00:45 · 216 阅读 · 0 评论 -
CSS3的使用及基本注意说明相关笔记(四)
1.使用CSS3来DIY图片i无缝轮播效果:图片大小:126*86<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>使用css3动画制作自动无缝轮播图</title> <sty原创 2018-07-02 12:19:48 · 159524 阅读 · 1 评论 -
CSS3的使用及基本注意说明相关笔记(三)
1.每一个方向上的边框形状并不是矩形的,其实是三角形或梯形的,配合圆角边框可以制作美丽花瓣<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>边框的实际形状(制作美丽花瓣)</title> &原创 2018-07-02 00:53:03 · 118465 阅读 · 1 评论 -
CSS3的使用及基本注意说明相关笔记(二)
1.css3圆角边框样式 border-radius◆border-radius表示盒子四个角(左上角、右上角、右下角、左下角)的弧度,border-radius:60px 60px 60px 60px;,如果圆角弧度四个值都相同,那个可以简写,border-radius:60px;(其实赋值的方式和margin与padding类似,都是shun时针赋值,赋一个值表示全方向,赋两个值表示左上角和右...原创 2018-07-01 23:30:46 · 155893 阅读 · 0 评论 -
CSS3的使用及基本注意说明相关笔记(一)
1.CSS3◆浏览器支持程度差,需要添加私有前缀,移动端支持优于pc端,因为移动端的浏览器都是最新版本的,css3也在不断改进中,应用的相对广泛。◆实际工作中写网页要使用渐进增强原则:低版本的浏览器可以正常访问页面,高版本的浏览器访问页面用户体验更好。◆实际工作中要考虑用户群体,遵照产品的方案,听技术的上司(最新的技术大多意味着兼容性不是很好)的安排。2.css2中的选择器◆div {} 标签选择...原创 2018-07-01 14:16:42 · 160992 阅读 · 0 评论 -
HTML5的使用及基本注意说明相关笔记(一)
1 网页开发方式上的两个层次:◆HTML4.1 ◇结构:html4.0 ◇样式:css css2 ◇行为:js◆HTML5 ◇结构:html5 ◇样式:css3 ◇行为:js API 有所增强 如 地理定位 web存储 拖拽 重力感应 硬件访问等2.HTML5◆HTML5狭义的概念上就是HTML4的升级版本,HTML5广义上的概念上就是代表着浏览器技术发展的的一个阶段,也就是 html5+css3...原创 2018-07-01 12:51:15 · 383 阅读 · 0 评论 -
js+面向对象+html5+canvas相关笔记(四)
1.函数的四种调用模式◆函数调用 == window◆方法调用 == 宿主◆构造器 == 实例对象◆上下文(间接调用) == 自由指定★函数执行时,内部的this指向才会确定,函数执行时this的指向与定义无关,与调用方式有关。2.绘制环境的保存与回滚◆状态可以保存多份◆回滚每次回滚到最近的状态保存◆状态的保存与回滚与路径无关。3.判断点在不在路径中:◆ctx.isPointInPath(要判断的...原创 2018-06-17 12:09:11 · 151 阅读 · 0 评论 -
js+面向对象+html5+canvas相关笔记(三)
1.绘制图片的API,ctx.drawImage()◆绘制图像的第一种方式,三参数版本,把图像绘制到指定的坐标:【img.onload=function(){//在图片加载完毕后,开始画图片,没有设置图片的宽高,所以超出部分会被隐藏ctx.drawImage(img,10,10);},第一个参数是图片元素对象,第二个参数是位于画布的x轴坐标点,第三个参数是位于画布的y轴坐标点】◆绘制图像的第二种方...原创 2018-06-17 12:09:03 · 201 阅读 · 0 评论 -
js+面向对象+html5+canvas相关笔记(一)
1.Canvas是Html5提供的一个展示绘图效果的标签<canvas></canvas>◆使用canvas标签,即可在页面中开辟一个区域,可以设置width和height来设置该区域的尺寸◆默认canvas的宽高为300和150◆不要使用css的方式设置宽高,应该使用html属性◆如果浏览器不支持canvas标签,那么就会将其解释为div标签,因此常常在canvas中嵌入...原创 2018-06-17 12:08:48 · 267 阅读 · 0 评论 -
html5相关笔记(三)
1.html5的应用场景◆极具表现力的网页(案例特别多)◆网页应用程序(pc端:iCloud、百度脑图、Office 365...,app端:淘宝、京东、美团...,wechat端:淘宝、京东、美团...),wechat表示微信,也就是微信小程序。◆混合式本地应用(PC端:网易云音乐、有道词典...,app端:淘宝、京东、美团...)◆简单的游戏◆2.Sublime有一个插件,叫做Sublime ...原创 2018-06-12 04:37:32 · 266 阅读 · 0 评论 -
html5相关笔记(二)
1.document.querySelector("button:nth-child()3"),是可以获取到元素的,html5新增的获取dom对象的api是支持css3新的选择器的。2.html5新增的语义化标签,多媒体盒子标签 figure,专门用来放视频标签、音频标签、图片标签等,<figure><figcaption>视频</figcaption><...原创 2018-06-12 04:37:12 · 207 阅读 · 0 评论 -
HTML5的使用及基本注意说明相关笔记(二)
1.使用HTML5来DIY彩虹播放器◆html5新增的语义化标签,多媒体盒子标签 figure,专门用来放视频标签、音频标签、图片标签等,<figure><figcaption>视频</figcaption></figure>◆document.querySelector("button:nth-child()3"),是可以获取到元素的,html5新...原创 2018-07-02 13:56:53 · 420670 阅读 · 0 评论