Web前端之家-专注Web前端开发，关注用户体验，了解最新前端开发动态

前端资源

最新文章实时了解最新、最快的互联网Web前端开发动态！

简述HTML5是什么

HTML/CSS Posted by 扣丁学堂 2018.11.14 views: 414 评论:0

HTML5开发技术还是参加HTML5培训的小伙伴都不在少数，本篇文章扣丁学堂小编和读者们分享一下HTML5是什么，对HTML5开发感兴趣的小伙伴就一起来了解一下吧。　　一、HTML5是什么　　HTML5isthelatestversionofHypertext...
HTML5有什么语义化可言？

HTML/CSS Posted by andy001 2018.10.09 views: 798 评论:0

HTML5有什么语义化可言呢，大家都知道HTML5增加了不少的标签，相对于HTML4.1版本，标签选择更多了。那么语义化怎么去解决呢？真正使用HTML5标签来开发的似乎不是很多（ps：查看了几个巨头公司网站推论），可能一部分原因是仍有部分用户使用在使用低版本浏...
关于HTML5中Ajax异步请求的基础流程分享

Html5 Posted by abc123 2018.07.16 views: 1654 评论:0

HTML5提供的方法，对跨域访问提供了很好的支持，并且还有一些新的功能。*IE10以下的版本都不支持*只需要在服务器端头部加上下面两句代码：header("Access-Control-Allow-Origin:*");header(&qu...
HTML5实现动态添加和删除元素

Js&JQuery Posted by 天空 2018.07.02 views: 3595 评论:0

HTML5实现动态添加和删除元素，其中最主要的是进行ID的赋值操作，每次添加相对应的ID需要进行加1，在删除时，通过ID除过来相关的ID进行删除；还有就是删除最后一个添加的元素时，再次追加时的ID判断，这里使用的方式如下：在删除元素之后，查询DIV下追加的共同...
学习HTML5中的input的属性

HTML/CSS Posted by ceshi 2018.07.02 views: 1958 评论:0

HTML5中的input的属性HTML4.01中，input的类型只有text、button、password、submit、radio、checkbox和hidden（隐藏域）。H5中新增了一些类型，使用起来更加方便，包括：color点击时弹出颜色选择器，可...
2018世界杯，用HTML5+CSS3来画个足球场

HTML/CSS Posted by 天空 2018.06.28 views: 2548 评论:0

HTML5+CSS3来画个足球场。<!DOCTYPE html><html><head> <style> bo...
HTML5移动应用研发与产业化的设计规划

移动开发 Posted by andy001 2018.04.09 views: 5450 评论:0

HTML5App应用的容器产品和开发工具。研发应用展现、应用安全、本地能力适配、主流操作系统兼容、系统硬件加速技术等领域的关键技术，实现跨平台移动应用（App）的开发运行引擎的自主可控，为基于HTML5的Web应用系统提供一个安全、高效、易用的跨平台支撑环境。...
推荐一些顶尖响应式HTML5网页模板帮你快速完成网页设计

HTML/CSS Posted by abc123 2018.03.29 views: 7751 评论:0

HTML5网页模板帮你快速完成网页设计。为了寻找一个优质的网页模板，网页设计师和开发者往往可能会花上大半天的时间。不过幸运的是，现在的网页设计师和开发人员已经开始共享HTML5，Bootstrap和CSS3中的免费网页模板资源。鉴于网站模板的灵活性和强大的功能...
W3C官方去年年底推出HTML5.2

移动开发 Posted by cidy2017 2018.02.27 views: 2176 评论:0

HTML5.2规范还增加了allowpresentation属性，该属性允许iframe可以访问演示API来让页面嵌入可以访问投影仪、监控器或网络连接电视等设备的第三方演示。演示API还只是一个W3C候选建议，目前只在Chrome上可用。在新规范中也越来越重视...
了解下HTML5的内嵌媒体

移动开发 Posted by cidy2017 2017.11.07 views: 2353 评论:0

视频已经在Web上广泛流行了，但是其格式几乎都是专有的。YouTube使用Flash，Microsoft使用WindowsMedia®，Apple使用QuickTime。在一种浏览器中用来嵌入这些内容的标记在另一种浏览器中是无效的。因此，WhatWG提议引入一...
HTML5中对dir属性

移动开发 Posted by qilongzhu 2017.11.07 views: 2521 评论:0

HTML5标准更鼓励大家通过设置dir属性来达到排版效果（例如搜索引擎可能不会抓取css文件）。 ......
了解HTML5之contenteditable属性

移动开发 Posted by jiang 2017.10.14 views: 2413 评论:0

contenteditable属性规定是否可编辑元素的内容。contenteditable是一个枚举类型的属性，可供选择的值有空字符串、true、false或inherit（默认）。当为空字符串时，效果和true一致。当一个元素的contenteditable...
HTML5 Canvas颜色选择器

移动开发 Posted by jiang 2017.10.14 views: 3189 评论:0

HTML5来创建一个网页颜色选择器。首先在Canvas画一幅图，然后添加鼠标事件“鼠标移动”，“鼠标点击”。在鼠标移动的时候，显示当前划过的颜色预览，在鼠标点击的时候，选中当前颜色，显示颜色的细节。<!DOCTYPE html><h...
HTML5中的FileReader、拖拽和canvas教程

Html5 Posted by admin 2017.02.13 views: 4058 评论:0

HTML5话题的时代，好像不懂点HTML5都有点落伍。那我也跟上潮流一把吧，今天给大家分享的是基于HTML5的自助切图。在组里经常会被某设计师叫切板仔，确实重构很大一部分工作都花在切图上，而如何提高切图效率或者让切图自助化也是我们重构师的追求。基于这个前提我自...
HTML5的自定义data-*属性和jquery的data()方法的使用示例

综合 Posted by admin 2017.02.11 views: 3476 评论:0

HTML5规范里增加了一个自定义data属性，你可以拿它做很多有用的事情。你可以去读一下HTML5的详细规范，但这个自定义data属性的用法非常的简单，就是你可以往HTML标签上添加任意以"data-"开头的属性，这些属性页面上是不显示的，它不会影响到你的页面...
HTML5 Canvas的文本设置字体和大小

移动开发 Posted by web176 2017.02.08 views: 8931 评论:0

HTML5Canvas的文本设置字体和大小，我们可以使用的字体在画布范围内的属性。下面我们就做一个简单的实例为大家讲解下，基本语法：context.font=[value];HTML5 Canvas Text Font ...
初学者对于HTML5的一些误解

Html5 Posted by admin 2017.02.08 views: 3743 评论:0

HTML5的时候，经常会质疑一些问题，正如Opera的布道者BruceLawson讲的那样，“每个人都在谈论HTML5”，它被传的很神，很玄。事实上有很多人所说的HTML5实际上只是古老的DHTML或者Ajax。把所有的信息混在一起就是一堆错误信息。HTML5...
CSS3,HTML5和jQuery搜索框集锦

综合 Posted by admin 2017.02.06 views: 3155 评论:0

HTML5/CSS3的搜索输入字段在本教程中我们使用两种不同的方法来构建一个扩大搜索字段。花式搜索框这是一个奇特的搜索框，非常有意思！搜索栏动画CriteriaSearchBox一种提示选择搜索，像商店类别的搜索框。jQuery和CSS3的"下一步级别"动画搜...
jQuery(非HTML5)可编辑表格实现代码

综合 Posted by admin 2017.02.05 views: 3114 评论:0

功能：单击单元格选中，选中过程中使用方向键更换选中的单元格，选中过程中按回车键或者直接双击单元格进入可编辑状态，单元格失去焦点时保存修改的内容。主要实现思路：选中，移动选中区域等都是依靠jQuery强大的API进行实现的。而可编辑的单元格实际上是在选中单元格时...
jQuery中使用data()方法读取HTML5自定义属性data-*实例

综合 Posted by admin 2017.02.04 views: 3010 评论:0

HTML5的api不同的是，jQuery会尝试将字符串转换为一个JavaScript值（包括布尔值（booleans），数字（numbers），对象（objects），数组（arrays）和空（null））。如果这样做不会改变数值的表示，那么该值将转换为一个数...
用HTML5实现一个twitch3D游戏

移动开发 Posted by web176 2017.02.02 views: 4482 评论:0

HTML5.html这篇文章国内有些机器译的版本，但实在太难阅读，这里试译了下。由于译者水平有限，可能会有不少错漏之处，一些不明确是否译准的地方附了原文。此文涉及挺多框架/库，在翻译过程中ip收获还是挺多的，建议大家在阅读时可以同时去了解下文中所提到的相关技术...
HTML5基础教程:video视频标签详解

移动开发 Posted by admin 2017.02.02 views: 4767 评论:0

HTML5中，就能完全脱离Flash或其他的插件来播放视频了。video标签：IE9FireFox5.0Safari5.5Chrome12Opera11.5Mpeg4√×√√×Ogg×√×√√WebM×√×√√Ogg：带有Theora视频编码和Vorbis音频...
使用jquery读取HTML5 localstorage的值的方法

综合 Posted by admin 2017.02.02 views: 3081 评论:0

HTML5LocalStorageExample</title><linkhref="//netdna.bootstrapcdn.com/twitter-boo...
HTML5中的标记方法

HTML/CSS Posted by admin 2017.01.18 views: 3852 评论:0

HTML5中的语法变化的变化，正是因为在HTML5之前几乎没有符合标准规范的Web浏览器。接下来让我们看一下，HTML5中的标记方法。内容类型（ContentType）DOCTYPE声明是HTML文件中必不可少的，它位于文件的第一行。在HTML4中，它的声明方...
HTML5之视频知识介绍和技术规范

移动开发 Posted by admin 2017.01.05 views: 4505 评论:0

HTML5的一个愿景就是脱离浏览器插件,微软真是让人觉得悲剧)。苹果决定不支持VP8,乔布斯认为VP8在质量或效率方面不如H.264,不能满足其产品的要求。另外最新消息表明VP8还有可能牵扯到专利的问题(如果真的侵犯专利的话,Opera和Firefox估计马上...
HTML5实例教程:article标签使用实例

Js&JQuery Posted by ceshi 2017.01.05 views: 3364 评论:0

article元素代表文档、页面或应用程序中独立的、完整的、可以独自被外部引用的内容。它可以是一篇博客或者报刊中的文章、一片论坛帖子、一段用户评论,或其它任何独立的内容。除了内容部分,一个article元素通常用作它自己的标题,有时还有它自己脚注。下面是一段关...
【每日一学】整理下HTML5页面的头部内容

移动开发 Posted by web176 2016.12.22 views: 4244 评论:0

HTML5页面的头部内容，你肯定不能错过。<!DOCTYPEhtml><html>...
HTML5语义化标签和基于HTML5的Web App

Html5 Posted by andy001 2016.12.20 views: 3975 评论:0

HTML5的WebApp，目前主流操作系统iOS、Android以及WindowsPhone的浏览器都对于HTML5大部分特性的支持也更加突显HTML5在未来移动设备端的地位。那么HTML5有何前景呢，接下来我们一起来讨论HTML5和WebApp：谈到WebA...
Modernizr为HTML5和CSS3而生

Html5 Posted by andy001 2016.12.17 views: 2951 评论:0

HTML5而生的——它是一个检测浏览器对HTML5和CSS3特性支持的JS库，著名的HTML5/CSS3浏览器兼容性网站FindmeByIP就是基于该框架实现的。可以看到，右下角绿色按钮上面有Modernizr的链接。Modernizr的功能modernizr...
分享几款不错的HTML5 Canvas和JavaScript动画

Html5 Posted by admin 2016.12.09 views: 4251 评论:0

HTML5Canvas和JavaScript动画，见多了，但是今天分享的确也是我先前没见过的，基于HTML5Canvas和JavaScript的动画，这些令人难以置信的效果将使你对HTML5彻底折服。需要指出的是，这些都是浏览器的原生动画，无需任何插件。HTM...
推荐15款值得大家收藏的HTML5资源

开发工具 Posted by andy001 2016.11.30 views: 4833 评论:0

HTML5资源不怕多，最重要的是要吸取其中的精华，为自己所用。今天主要分享15款值得大家收藏的HTML5资源。1、WTFisHTML5这是一个关于HTML5Infographics的站点，包含诸如HTML5同Flash的对比，HTML5不同浏览器支持情况，HT...
【HTML5每日一练】Canvas标签绘制径向渐变图形

Html5 Posted by admin 2016.11.30 views: 3843 评论:0

HTML5每日一练之Canvas标签的应用-绘制径向渐变图形</title><script type="text/javascript">window.onload = function...
【HTML5每日一练】Canvas标签绘制线性渐变图形

Html5 Posted by andy001 2016.11.30 views: 4055 评论:0

HTML5每日一练之Canvas标签的应用-绘制线性渐变图形</title><script type="text/javascript">window.onload = function...
HTML5中figure和figcaption标签用法

Html5 Posted by admin 2016.11.24 views: 7387 评论:0

HTML5中figure和figcaption标签一般都是配套使用的，先了解下两者的基本定义，然后结合实例来说明两者的用法。<figure><figure>标签规定独立的流内容（图像、图表、照片、代码等等）。figure元素的内容应该与...
解析HTML5中hgroup元素

Html5 Posted by andy001 2016.11.21 views: 4729 评论:0

HTML5中新定义的元素，用来将标题和副标题群组。在我们已经有header标签的情况下，为什么我们还要一个<hgroup>标签？下面将是这个问题的解答。什么是<hgroup>元素下面是文档关于的描述<hgroup>的描述：h...
谈谈HTML5中的语义化标签：section和article

Html5 Posted by andy001 2016.11.21 views: 3786 评论:0

HTML5相关的分享内容，近两次都谈到了H5的大纲算法，主要针对H5语义化标签的应用。HTML5带出了一系列新元素，并且将在未来被广泛应用。然而，有一些元素在使用时易被混淆，包括以下两个新元素：<article>和<section>。最...
HTML5到底给我们带来了什么好处

Html5 Posted by admin 2016.11.20 views: 4546 评论:0

HTML5，可能很多人都不是了解它会给我们带来什么，也许只有慢慢从项目中才能体会出它的神奇。几乎每天我们都能发现新的关于传授和推广HTML5的资源和文章,我们也在HTML5boilerplate和HTML5Reset(尽管他们已经超出了HTML5的范畴)给出了...
HTML5 Canvas的文本如何实现垂直对齐

js笔记 Posted by admin 2016.11.12 views: 4935 评论:0

HTML5Canvas中实现垂直对齐，如何设置呢，这就是今天要分享的笔记。HTML画布垂直对齐的文本，我们可以使用的textBaseline在画布范围内的属性值。textBaseline可以设置以下值之一：top,hanging,middle,alphabet...
HTML5 Canvas学习教程：概览

Canvas教程 Posted by admin 2016.10.27 views: 3812 评论:0

HTML5Canvas元素允许我们在HTML5页面中的canvas区域自由的绘制图形。让我们先来体验一下HTML5Canvas。点击“绘制”按钮，它将会在下面的canvas区域绘制一些图形。你的浏览器不支持HTML5Canvas！绘制在这个例子中只显示了一些基...
HTML5技术革命：迎接HTML5.1，展望HTML5.2

Html5 Posted by admin 2016.10.18 views: 5541 评论:2

HTML5的到来，让互联网刮起一阵“飓风”，HTML5凭借语义性、兼容性和不需要第三方依赖的API迅速席卷了整个互联网，这是一场革命性的技术变革。随着谷歌浏览器的崛起，HTML5日渐成熟了，与此同时，我们即将迎接新的版本HTML5.1。据所知，HTML5.1的...
HTML5 Canvas：制作动画特效

Canvas教程 Posted by admin 2016.09.28 views: 5061 评论:0

HTML5canvas中绘制图像动画效果，你需要绘制出每一帧的图像，然后在一个极短的时间内从一帧过渡到下一帧，形成动画效果。这其实是一种视觉欺骗，原理就像播放电影一样，胶片上每一格是一帧图片，然后快速的播放它们，在人的眼睛看来就是一个完整的动画效果。制作can...
HTML5 Canvas：绘制阴影和填充模式

Canvas教程 Posted by admin 2016.09.28 views: 4803 评论:0

HTML5canvas上绘制出图形或文字的阴影效果。canvas的阴影效果非常简单，通过一些简单的设置，就可以自动在图片或文字下面生成相应的阴影。下面是一个简单的例子：你的浏览器不支持HTML5Canvas！在canvas中，图形的阴影由2D上下文的4个属性来...
HTML5 Canvas：图形转换

Canvas教程 Posted by admin 2016.09.27 views: 4666 评论:0

HTML5canvas中绘制的图形应用转换效果。下面是可以使用的转换列表：移动旋转缩放移动我们可以将绘制在canvas上的任何图形进行移动操作。移动意味着要重新定位绘制的图形。下面是一个示例代码：var x = 100;var&n...
HTML5 Canvas：绘图状态和状态栈

Canvas教程 Posted by admin 2016.09.18 views: 4270 评论:0

HTML5canvas中使用2D上下文来绘制图形的时候，2D上下文会处于某种状态中。你可以通过操纵2D上下文的属性来设置这些状态，例如fillStyle属性和strokeStyle属性。所有的这些操作被称为2D上下文的state（状态）。有时候，我们在canv...
HTML5 Canvas：绘制渐变色

Canvas教程 Posted by admin 2016.09.15 views: 5108 评论:0

HTML5Canvas渐变是一种用于填充或描边图形的颜色模式。渐变色是由不同的颜色进行过渡，而不是单一的颜色。先来看几个canvas渐变色的例子：你的浏览器不支持HTML5Canvas！渐变按照类型来分可以分为两种类型：线性渐变径向渐变线性渐变以线性的模式来改...
HTML5 Canvas：合成模式

Canvas教程 Posted by admin 2016.09.14 views: 4524 评论:0

HTML5canvas的例子中，图形的绘制都是一个图形位于另一个图形之上的。我们可以通过设置globalCompositeOperation属性来修改这个默认的行为。换句话来说，我们可以设置绘制的图形与已经绘制在canvas上的图形的合成模式。2D上下文有两个...
HTML5 Canvas：像素处理

Canvas教程 Posted by admin 2016.09.12 views: 5949 评论:0

HTML5canvas中获取单个像素。通过ImageData对象我们可以以读写一个数据数组的方式来操纵像素数据。当完成像素操作之后，如果要显示它们，需要将这些像素复制到canvas上。创建一个ImageData对象要创建一个ImageData对象，可以使用2D...
HTML5 Canvas：绘制图片

Canvas教程 Posted by admin 2016.09.11 views: 5727 评论:0

HTML5canvas中绘制图形和文字，并给它们设置一些样式。我们还可以在<canvas>中绘制图片。用于在<canvas>作为绘制源的图片可以是下面的几种元素类型：HTMLImageElement：可以是由Image()构造函数创建的...
HTML5 Canvas：绘制文字

Canvas教程 Posted by admin 2016.09.10 views: 5944 评论:0

HTML5canvas上绘制绘制文字，并且可以设置文字的字体，大小和颜色。绘制文字的字体由2D上下文的font属性来控制。如果你需要使用颜色来填充文字或制作描边文字，可以使用2D上下文的fillStyle和strokeStyle属性来完成。要在canvas上绘...
HTML5 Canvas：获取canvas内容-toDataURL()

Canvas教程 Posted by admin 2016.09.08 views: 7512 评论:0

HTML5canvas中的内容。做法类似下面的示例代码：var canvas = document.getElementById("ex1");var dataUrl =&nbs...