`

HTML5学习初步

阅读更多

 

新增标签

Markup Elements

Meida Elements

Canvas Elements

Form Elements

Input Type Attribute Values

 

<video><audio>标签

 

<canvas>标签

创建一个canvas <canvas id="myCanvas" width="200" height="100"></canvas>

通过JS控制

var c=document.getElementById("myCanvas");

var cxt=c.getContext("2d");

//画个矩形

cxt.fillStyle="#FF0000";

cxt.fillRect(0,0,150,75);

//画线

cxt.moveTo(10,10);

cxt.lineTo(150,50);

cxt.lineTo(10,50);

cxt.stroke();

//画圆

cxt.fillStyle="#FF0000";

cxt.beginPath();

cxt.arc(70,18,15,0,Math.PI*2,true);

cxt.closePath();

cxt.fill();

//渲染

var grd=cxt.createLinearGradient(0,0,175,50);

grd.addColorStop(0,"#FF0000");

grd.addColorStop(1,"#00FF00");

cxt.fillStyle=grd;

cxt.fillRect(0,0,175,50);

//放置图片

var img=new Image();

img.src="img_flwr.png";

cxt.drawImage(img,0,0);

 

通过JS存储数据 

localStorage 一直存在

<script type="text/javascript">

localStorage.lastname="Smith";

document.write(localStorage.lastname);

</script>

 

sessionStorage 浏览器进程

<script type="text/javascript">

sessionStorage.lastname="Smith";

document.write(sessionStorage.lastname);

</script>

 

更多的input type="?"

<email><url>自动验证

<number><range>可设置min max step value

DatePickers 包括<month><week><time><datatime><datatime-local>

<search>

<color>

 

Form

<datalist><keygen><output> (没看明白)

Form Attribute

autocomplete(记录 类似ajax那种输入提示)

autofocus

form(让分开的form结构联系到一起 通过id)

其他诸如novalidate placeholder multiple pattern 等等表单属性

 

另外多出很多诸如Tags Attributes Events等

惨遭Reference


写得非常详细
分享到:
评论

相关推荐

    初步学习html.zip

    html 学习资料 项目资料 项目源码 供学习参考 html 学习资料 项目资料 项目源码 供学习参考 html 学习资料 项目资料 项目源码 供学习参考 html 学习资料 项目资料 项目源码 供学习参考 html 学习资料 项目资料 项目...

    初步学习HTML CSS JS 工程.zip

    html 学习资料 项目资料 项目源码 供学习参考 html 学习资料 项目资料 项目源码 供学习参考 html 学习资料 项目资料 项目源码 供学习参考 html 学习资料 项目资料 项目源码 供学习参考 html 学习资料 项目资料 项目...

    html5初步接触

    这篇博客文章“html5初步接触”可能涵盖了一些基本概念,让我们深入了解一下HTML5的核心特点和相关知识点。 1. **语义化标签**:HTML5引入了新的语义化元素,如`&lt;header&gt;`、`&lt;nav&gt;`、`&lt;article&gt;`、`&lt;section&gt;`和`...

    HTML初步学习,笔记记录

    HTML初步学习笔记记录 HTML(Hyper Text Markup Language)是一种超文本标记语言,不是一种编程语言,而是一组标签,用于描绘整个网页的内容。 HTML标签通常是成对出现的,第一个标签是开始标签,第二个标签是结束...

    HTML5学习笔记(总结提炼版)——001

    HTML5是现代网页开发的核心,它是超文本标记语言HTML的第五...以上就是对HTML5学习笔记的初步总结,涵盖了HTML5的关键特性、常见标签以及编码的最佳实践。深入理解和掌握这些知识,将有助于成为一名熟练的前端开发者。

    HTML5+CSS3网页设计与制作—教学大纲.pdf

    本章节旨在帮助学生建立对网页设计的整体认知,理解HTML5、CSS3以及JavaScript在网页开发中的作用,并初步接触Dreamweaver这一工具。通过学习,学生将能够: - **理解网页的概念与组成**:了解网页的基本构成要素...

    基于 html5 , css3 , js 的,对表单提交的账号密码做初步的校验.zip

    HTML5引入了新的表单元素和属性,如`&lt;input type="email"&gt;`用于邮箱输入,`&lt;input type="password"&gt;`用于密码输入,以及`required`属性用于强制字段非空,`pattern`属性用于设定输入格式,这些都可以在客户端进行...

    jquery初步入门学习小资料

    **jQuery 初步入门学习小资料** jQuery 是一个广受欢迎的 JavaScript 库,它极大地简化了 JavaScript 的使用,使得开发者可以高效地实现网页交互、动画效果以及与服务器的数据通信。这个压缩包文件提供了关于 ...

    Python与机器学习教程 机器学习算法课程-HTML网页版教程课件 可直接在浏览器运行 从入门到进阶.rar

    5. **Day01内容**:可能涵盖Python基础知识和机器学习概念的介绍,以及如何使用Python环境进行初步的数据探索。 6. **Day02内容**:可能会深入到监督学习的算法,比如线性模型、决策树及其变种,并介绍数据预处理的...

    HTML5入门视频教程:第一章,概论.rar

    总的来说,这个"HTML5入门视频教程:第一章,概论"将涵盖以上核心概念,帮助新手建立起对HTML5的初步认识,并为后续深入学习和实践打下坚实基础。通过观看这个视频,学习者将能够理解HTML5的重要性,以及它如何改变...

    HTML5+PHP 实现 保存文件夹相对路径 递归上传 在线浏览 - 可视化和机器学习 - CSDN博客1

    在本文中,我们将探讨如何使用HTML5和PHP技术来实现文件夹的递归上传和在线浏览功能,同时结合数据可视化和机器学习的概念。这个话题主要分为三个关键部分:上传文件夹并保存相对路径、构建后台目录结构以及在浏览器...

    HTML.zip_html5

    通过这些文件,我们可以学习到如何利用HTML5创建交互式的网页表单,实现滚动文字效果,并初步了解SVG图形的使用。实践是学习HTML5的最佳途径,尝试编写并修改这些示例,将有助于深入理解和掌握相关知识。

    洪恩在线--DOS学习HTML打包下载

    接下来,我们转向HTML学习。HTML是网页制作的基础,包括以下关键知识点: 1. **HTML结构**:理解HTML文档的基本结构,包括`&lt;html&gt;`、`&lt;head&gt;`、`&lt;body&gt;`等标签。 2. **标签语法**:学习各种HTML标签的用法,如文本...

    学生管理 数据库初步学习

    《学生管理数据库初步学习》是针对初学者设计的一套学习资源,旨在帮助学生掌握数据库的基础知识和技术。这个压缩包包含了多种文件,它们共同构成了一个简易的学生管理系统,为学习数据库提供了实际操作的平台。 ...

    MATLAB图像处理之初步学习

    MATLAB图像处理之初步学习是我学习matlab图像处理时,所做的一点整理,还没有深入的看下去。加压后,html文件夹下的打开matlab.html就会显示内容。这时用matlab所写的matlab.m文件自动生成的。

    XML初步到精通

    XML(eXtensible Markup Language)是一种用于标记数据的语言,其设计目的是传输和存储数据,而非显示数据。在深入理解XML之前,我们首先要明白它的基本..."XML初步到精通"的学习资源将是你踏上这一旅程的良好开端。

Global site tag (gtag.js) - Google Analytics