聊聊有趣的HTML5 Canvas！
Canvas 是 HTML5 提供的一个用于展示绘图效果的标签. Canvas 原意为画布, 在 HTML 页面中用于展示绘图效果. 最早 Canvas 是苹果提出的一个方案, 今天已经在大多数浏览器中...
2020-09-30
图片上传和canvas压缩的方法介绍（流程）
我们通常在做图片上传的时候都会遇上这样的情况，一是后端接口限制上传图片的大小，或者是即使后端没有限制大小，因为图片太大在前端渲染时太慢，造成页面加载体验较差。因此我们很...
2020-09-30
7个提升网页SVG文件可访问性的方案
1、作为图片使用的 SVG 文件如果你的 SVG 是作为 <img> 的 src 引入的，务必为 <img> 添加 role="img" 属性：<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/163671/...
2020-09-30
先建立css还是html？
对于一个新手而言，在有了一点html知识之后，对于CSS、DIV都感觉特别的疑惑，不知道这其中到底是什么联系?为什么用了CSS的网页不能像其它代码一样直观?html和css哪个先写?其实这...
2020-09-30
HTML5移动端自适应的方法介绍
屏幕自适应方案介绍方案之前，首先还是交代一下项目背景与需求，毕竟一切方案也不能脱离实际需求。需求与背景 设备宽度 > 800px， body宽度为800px 320px < 设备宽度 < 800px，...
2020-09-30
HTML5文件上传下载介绍
FileList 对象和 file 对象HTML 中的 input[type="file"] 标签有个 multiple 属性，允许用户选择多个文件，FileList对象则就是表示用户选择的文件列表。这个列表中的每一个文件...
2020-09-30
HTML head元素中常用标签介绍
1、<title>标签定义文档的标题title元素在所有的HTML文档中都是必须的，它定义浏览器地址栏中显示的标题，实例如下<!DOCTYPE html><html><head> <title> This is my HTML</t...
2020-09-30
HTML中五种网页跳转的方法
网页自动跳转5种方法：第一种网页自动跳转方法：meta refresh自动跳转法在网页的head区域的meta refresh标签中，加入自动跳转代码，可实现网页的立即或延时自动跳转。示例如下： <met...
2020-09-30
HTML图像标签（img）和源属性（src）介绍
在 HTML 中，图像由<img> 标签定义。<img> 是空标签，意思是说，它只包含属性，并且没有闭合标签。要在页面上显示图像，你需要使用源属性（src）。src 指 "source"。源属性的值是图像的...
2020-09-30
html中给table加边框的方法介绍
一般来说，给表格加边框都会出现不同的问题，以下是给表格加边框后展现比较好的方式：<style> table,table tr th, table tr td { border:1px solid #0094ff; } tab...
2020-09-30
浅谈HTML中提高页面加载速度的方法
HTML中提高页面加载速度的方法（1）减少 HTTP 的请求。（合并资源文件、使用图片精灵）；（2）把CSS 放头部，把 JavaScript 放到 body 标签尾部；（3）定义图片的宽和高；（4）定义字符集；（5）避免空的 src...
2020-09-30
HTML5的特性和技巧
1、新的文档类型（Doctype）<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">你还在使用上面这个...
2020-09-30
HTML5中一些常用的元素与属性介绍
一、HTML5保留的常用元素1、基本元素HTML保留的基本元素有如下几个： <!-- -->： 定义HTML注释 <html>：HTML5文档的根元素 <head>：定义HTML5文档的页面头部分 <title>：定义HTML...
2020-09-30
前端必备的Canvas接口和动画效果（总结）
概述<canvas>元素用于生成图像。它本身就像一个画布，JavaScript 通过操作它的 API，在上面生成图像。它的底层是一个个像素，基本上<canvas>是一个可以用 JavaScript 操作的位图（b...
2020-09-30
HTML特殊符号编码对照表(值得收藏)
往网页中输入特殊字符，需在html代码中加入以&开头的字母组合或以&#开头的数字。下面就是以字母或数字表示的特殊符号大全。HTML 特殊符号编码对照表: 特殊符号 命名...
2020-09-30
HTML5的离线缓存介绍
HTML5的离线存储是基于一个新建的.manifest文件的，通过这个文件上的解析清单离线存储资源，这些资源就会像cookie一样被存储了下来，之后当网络在处于离线状态下时，浏览器会通过离...
2020-09-30
浅谈HTML标签元素中 alt 和 title 属性的区别
概述这道题大概还可以加个限定词，我们暂且把 <title> 标签排除在本次讨论之外。元素的 alt 和 title 属性 有什么区别？ALT 属性最常见用在 <img> 标签上，那我们先来看下 <img>...
2020-09-30
html+css+js如何实现弹球游戏？（代码示例）
使用html+css+js实现弹球游戏代码如下，复制即可使用：<!doctype html><head> <style type="text/css"> .panel{ position: relative; z-index...
2020-09-30
一个动态的登录页面推荐(html)
实现代码：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML> <HEAD> <TITLE> </TITLE> <meta http-equiv="Content-Type" content="text/html; chars...
2020-09-30
html5使用svg的方法步骤
创建svg文件：<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="10...
2020-09-30
利用HTML5 canvas旋转图片实例演示
实例演示：http://www.imqing.com/demo/rotateImg.html原理：利用canvas对象来旋转。实现方式：首先创建一个canvas元素，然后把img元素绘入canvas。但是，实际上，这是默认情况，就是图片...
2020-09-30
HTML中name、id、class的区别介绍
1. name指定标签的名称。1.1 格式<input type="text" name="username" />1.2 应用场景①form表单：name可作为转递给服务器表单列表的变量名；如上面的传到服务器的名称为：userna...
2020-09-30
使用XML及XSL生成简单HTML的方法介绍
首先，准备XML文件，这里为了演示，随便定义了一组数据。这些定义好的数据用于后面套入到对应的xsl模板中。<ROOT><ASPNETX Username="dudu" City="Shanghai" Cool="70" /><ASPNET...
2020-09-30
你必须知道的一些HTML优化技巧
很显然HTML 已经达到了一个瓶颈，尽管它是开发Web 界面必备的核心语言。HTML页面的负载也是越来越重。大多数页面平均需要40K的空间,像一些大型网站会包含数以千计的HTML 元素...
2020-09-30
HTML中表格相关的知识
<table>标签中比较少见的属性和子标签：summary 属性：用于概括整个表格的内容。它对于搜索引擎的机器人记录信息十分重要。bordercolor 属性：用来设置表格边框的颜色。但它在不...
2020-09-30
HTML中的meta标签属性使用介绍
在查阅w3school中，第一句话中的“元数据”就让我开始了Google之旅。然后很顺利的在英文版的w3school找到了想要的结果。The <meta> tag provides metadata about t...
2020-09-30
HTML几种基础控件介绍
1. <input>标签<input> 标签用于搜集用户信息。1.1 type属性根据不同的 type 属性值，输入字段拥有很多种形式。可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等...
2020-09-30
如何在Canvas上的图形/图像绑定事件监听的实现
HTML中只能为元素/标签绑定监听函数；Canvas绘图中只有一个元素-canvas，每一个图形/图像都不是元素，不能直接进行事件绑定。解决办法：“事件委托”——让can...
2020-09-19
canvas绘制图片drawImage使用方法
不得不说，html5中的canvas真的非常强大，从图片处理，到视频处理，再到游戏开发，都能见到canvas的身影，然而，就这一个<canvas>标签，功能居然如此强大，这主要归功于canvas强大的API，也正是...
2020-09-19
详解html-webpack-plugin使用
最近在react项目中初次用到了html-webapck-plugin插件，用到该插件的两个主要作用：为html文件中引入的外部资源如script、link动态添加每次compile后的hash，防止引用缓存的外部...
2020-09-19
关于canvas.toDataURL 在iOS运行失败的问题解决
这篇文章主要介绍了关于canvas.toDataURL 在iOS运行失败的问题解决，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧...
2020-09-16
HTML5中外部浏览器唤起微信分享功能的代码
最近在做一个手机站，要求点击分享可以直接打开微信分享出去。而不是jiathis，share分享这种的点击出来二维码。在网上看了很多，都说APP能唤起微信，手机网页实现不了。也找了很多...
2020-09-16
在html页面中加入js可以用什么方法
方法一：在head标签内引入JS文件<html> <head> <script src="此处写你的js文件路径"></script> </head> <body> </body></html>方法二：在body标签内写JS代...
2020-09-16
html怎么实现左右滑动导航栏
背景：最近在写一个公众号项目时遇到需要动态生成菜单可滑动，在之前的android开发中实现通过v7包中提供的组件即可完成。那么，在网页的开发中需要如何实现这个功能呢？可以通过swi...
2020-08-25
HTML 之 ContentEditable 属性
HTML中的contentEditable的属性可以打开某些元素的可编辑状态，也许你没用过contentEditable属性，甚至从未听说过，contentEditable的作用相当神奇，可以让div或整个网页，以及span等...
2020-05-22
基于html5 canvas做批改作业的小插件
今天公司有一个新的需求，就是要在返回的作业照片里面可以涂鸦批改，批改完后就连同批改后的照片上传到服务器。这对我不怎么熟悉canvas的人来说是个挑战。需求分析 能进行批改，...
2020-05-20
网页文件的头部标记有哪些
头部标记概述：<head>标签在HTML语言的头部元素中，一般需要包括标题、基底信息、元信息等。一般情况下，CSS和JavaScript都定义在头元素中的，而定义在HTML语言头部的内容往往不会...
2020-05-12
HTML怎么实现下拉菜单
HTML怎么实现下拉菜单1、新建HTML文件为“select.html”；2、使用VSCode编辑器将其打开；3、在HTML的body标签里写入select标签；<select> </select>4、向select...
2020-05-12
img标签中alt属性的作用是什么
作用：<img> 标签的 alt 属性指定了替代文本，用于在图像无法显示或者用户禁用图像显示时，代替图像显示在浏览器中的内容。alt 属性是一个必需的属性，它规定在图像无法显示时的替...
2020-05-10
html中调用html的几种方法实例
html中引入调用另一个html的方法，尝试了好几种，都列出来：其中第一种是最好的，其他的方法，可以尝试看看，是不是适合你当前项目一、div+$(“#page1”).load(“b.html...
2020-05-09
设置网页关键字的name属性值应该为什么
设置网页关键字的name属性值应该为什么？设置网页关键字的name属性值应该为“keywords”。<meta> 标签语法<meta name="value">name 属性规定元数据的名称。 specif...
2020-04-28
html网页添加音乐视频的实现示例
1.video标签支持firefox自动播放 谷歌、ie不支持自动播放<video controls="controls" autoplay="autoplay" name="media"><source src="./img/music.mp3" type="audio/mpeg"...
2020-04-20
HTML页面插入SVG的多种方式
SVG (Scalable Vector Graphics) 可缩放矢量图，是一种基于XML语法的图像格式。其他图像格式都是基于像素处理的，SVG则是属于对图像的形状描述，所以它本质上是文本文件，体积相对...
2020-04-20
HTML/CSS中的空格处理\_如何保留页面中的空格
HTML中的空格的规则在html中内容中的多个空格一般会被视为一个，连续的多个空格符被自动合并了。同时内容前后的空格也会被清除， 如下：<p> freexyz cn </p>显示效果为：freexyz cn...
2020-04-20
网站制作favicon.ico最完美的方式
做网站的人如果细心一点，一定会制作favicon.ico，让浏览器标签顶部显示自己网站的小LOGO，是一件很有成就感的事。但是目前市面上浏览器种类比较多，不同的浏览器对待favicon.ico的...
2020-04-15
详解canvas.toDataURL()报错的解决方案全都在这了
报错详尽信息Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.关键词 canvas.toDa...
2020-04-02
根据浏览器不同加载不同的css实现兼容
浏览器有IE阵营、火狐阵营、谷歌阵营、苹果Safari阵营，特别是IE系列，更是有各种版本兼容问题，由于其他浏览器都能轻易升级到新版，而只有IE升级麻烦，高版本的IE甚至需要高版本系统...
2020-03-10
HTML特殊字符编码对照表
下面列举的是在html中一些比较特殊的字符符号的编码表示，工作中偶尔会用到，记录一下。 特殊符号 命名实体 十进制编码 特殊符号 命名实体 十进制编码 特殊符...
2020-02-20
HTML中有哪些文本标签？
HTML中有哪些文本标签？下面本篇文章就来给大家介绍一下HTML中的文本标签。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。一、标题标签单词缩写： head 头部....
2019-11-11
div+css与table的区别是什么？
众所周知，这（DIV+CSS和Table）两种语句都经常被开发人员使用了来控制界面显示，但是这两种语法也有很大的不同，下面分别从这两种语句的优缺点进行分析。制作效率我想没人反对表格的...
2019-11-10
