HTML/HTML5常用标签和属性
HTML/HTML5 常用标签和属性
四、标题标签
TIP
h 系列标签表示 “标题” 含义，h 是 headline 的意思
1、h1~h6 标签
标签
语义
h1
一级标题
h2
二级标题
h3
三级标题
h4
四级标题
h5
五级标题
h6
六级标题
关于 h 标签详细解读
<h1></h1>标签的内容对于搜索引擎来说非常重要，相当于一篇文章的标题（主 ...
浅谈重绘和回流的解析
目录重绘和回流：关于字体颜色的设置：关于替代：关于操作html：重绘和回流：
repaint(重绘) ，repaint发生更改时，元素的外观被改变，且在没有改变布局的情况下发生，如改变outline,visibility,background color，不会影响到dom结构渲染。
reflow(渲染)，与repaint区别就是他会影响到dom的结构渲染，同时他会触发repaint， ...
使用display:none时隐藏DOM元素无法获取实际宽高的解决方法
案例说明
当DOM元素被添加上display:none;的样式时，这个元素和它的子元素无法获取到实际的宽高。如图，我设置了一个父元素和一个子元素，并且通过一个按钮切换父元素是否带有display:none;。
然后每次点击按钮后，在控制台输出两个元素的高度。
可以看到，当元素正常显示时，获取宽高正常。而当元素添加上`display:none; ...
HTML5
使用说明书 - 标签的语法
1. 标签由英文尖括号<和>括起来，如<html>就是一个标签。
2. html中的标签一般都是成对出现的，分开始标签和结束标签。结束标签比开始标签多了一个/。
如：
（1） <p></p>
（2） <div></div>
（3） <span></span>
3. 标签与标签之间是可以嵌套的，但先后顺序必须保持一致 ...
HTML5 video controlslist All In One
HTML5 video controlslist All In One
controlslist="nodownload" 属性, 禁用视频播放器的下载选项
<div class="video-wapper">
<video controls="" controlslist="nodownload" class="video" src="https://cdn.xgqfrms.xyz/HTML5/video/controlslist.mp4"></video>
</div>
HTMLMediaElement.controlsList
The control ...
HTML5的拖拽功能--draggable
<div>
<div class="drag" draggable="true" id="dragger" ondragstart="handleDragStart(event)" ondrag="handleDrag(event)" ondragend="handleDragEnd(event)">
拖动元素
</div>
<div class="drop" ondrop="handleDrop(event)" ondragenter="handleDragEnter(event)" ondragover="handleDragOver(event)" ondr ...
H5（HTML5）
在最近几年中，在网络营销方面突然出现了一颗明日之星，这就是H5营销，那么H5究竟是个什么呢？H5的全名是HTML5，是HTML的高级版本，也就是移动端的web页面，有了这个后我们就无需在移动端下载插件就能任意观看各种动画与图像了，在H5刚出来的时候就因为优秀的兼容性和极快的传播速度在微信上一夜爆红，也因此出现了以H5为 ...
HTML5 Canvas 超逼真烟花绽放动画
各位前端朋友们，大家好！五一假期即将结束，在开启加班模式之前，我要给大家分享一个超酷超逼真的HTML5 Canvas烟花模拟动画。这次升级版的烟花动画有以下几个特点：
烟花绽放时，将展现不同的色彩，不像之前版本的一朵烟花只有一种色彩。
夜空的颜色会自动适配当前绽放的烟花颜色，效果更为逼真。
每一朵烟花绽放时的形状 ...
HTML5
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
your content here
</body>
</html>
<!DOCTYPE html> 声明为 HTML5 文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元（meta）数据，如 <meta charset="utf-8 ...
超酷！！HTML5 Canvas 水流样式 Loading 动画
今天我们要分享另外一款基于HTML5 Canvas的液体流动样式Loading加载动画，这款Loading动画在加载时会呈现液体流动的动画效果，并且由于和背景颜色的对比，也略微呈现发光的动画效果。
效果预览
代码实现
HTML代码
接下来我们讲讲实现这个加载动画的大致思路和实现过程。
首先在页面上定义一个canvas元素，用来承载这个Load ...
HTML5
一、初识HTML5
1、HTML
超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。
您可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析。
HTML 4.01的上一个版本诞生于 1999 年。自从那以后，Web 世界已经经历了巨变。
概念1：超文本
所谓的超文本，有 ...
HTML常用标签超详细整理
目录HTML概述1.1 什么是HTML1.2 HTML概念HTML常用基础标签标签的分类:常用基本标签HTML概述
1.1 什么是HTML
HTML是做网站的、Web开发、互联网生态开发(PC端+移动端+微应用) 目前我们使用的都是HTML5,支持传统的PC端开发，还支持移动端开发还支持微应用开发,从而替换了部分传统的移动端开发技术
1.2 HTML概念
HTML:Hyper Tex ...
初识HTML5
HTML5的学习笔记（随便总结，个人使用）
一、认识HTML5的基本格式
1、<!doctype> 标记
<!doctype>标记位于文档的最前端，用于向浏览器说明当前文档使用的是那种HTML标准规范。只有在开头处使用 <!doctype> 声明，浏览器才能将该网页作为有效的HTML文档，并且按照指定的文档类型 ...
几行代码把Chrome搞崩溃之：HTML5 MP3录音由ScriptProcessorNode升级成AudioWorkletNode采坑记
关键词: STATUS_ACCESS_VIOLATION AudioContext AudioWorkletNode audioWorklet addModule resume suspended createScriptProcessor
搞崩Chrome测试页：测试页地址
目录事件起因现象复现填坑处理最终结果
事件起因
我前些年GitHub开源的前端H5录音库：https://github.com/xiangyuecn/Recorder，提供了 mp3 wav ogg webm a ...
Javascript的独特的概念之闭包
目录Javascript闭包简介：为什么是闭包：总结Javascript闭包简介：
Javascript语言中，有一个独特的概念：闭包（closure），这在类似C++，Java等编程语言中没有这个概念。很多高级应用都要依靠闭包实现。
为什么是闭包：
或者说，为什么需要闭包，闭包的作用到底是什么？要理解这个概念，首先要理解Javascript中的作用域。
...
HTML5
HTML
什么是HTML及其标准
HTML
Hyper Text Markup Language（超文本标记语言）
超文本：文字、图片、音频、视频、动画等
HTML5的优势
世界知名浏览器厂商对HTML5的支持：微软，苹果，Google，Opera，Mozilla
市场的需求
跨平台
W3C标准
W3C
World Wide Web Consortium（万维网联盟）
成立于1994年，Web技术领域 ...
在web端使用html5访问远程桌面
前几天看见一篇文章很受启发，通过html5实现远程桌面共享，但是文中给的两段代码实在没有多大用途，
于是这几天正好西安封城，就研究了一下简单实现了，不过还不太稳定，先发布出来。
1、原理简介
服务器端就是被控制的电脑，开启websocket端口监听，可以用封装好的fleck包。
接收到客户端信息解析键盘和鼠标事件，然后在本 ...
html5调用摄像头截图
关于html5调用音视频等多媒体硬件的API已经很成熟，不过一直找不到机会把这些硬件转化为实际的应用场景，不过近年来随着iot和AI的浪潮，我觉得软硬结合的时机已经成熟。那我们就提前熟悉下怎么操作这些多媒体硬件吧，首先图像识别是其中最热门的应用场景，首先实现调用摄像头以及截图。
demo的效果请看：摄像头截图
API兼 ...
CSS自定义滚动条样式案例详解
CSS3自定义滚动条样式 -webkit-scrollbar
当内容超出容器时，容器会出现滚动条，其自带的滚动条有时无法满足我们审美要求，那么我们可以通过css伪类来实现对滚动条的自定义。
首先我们要了解滚动条。滚动条从外观来看是由两部分组成：1，可以滑动的部分，我们叫它滑块2，滚动条的轨道，即滑块的轨道，一般来说滑块的颜色比 ...
当动态桌面遇上 HTML5
DreamScene2 + HTML5 = 无限可能。时隔一周 DreamScene2 动态桌面的功能也得到了增强，欢迎 Star 和 Fork https://github.com/he55/DreamScene2
萌萌的看板娘谁能拒绝
喜欢可以看这里 https://github.com/he55/DreamScene2/releases/latest ，资源是从 Live2D 官网提取下来的。
使用方法
先下载最新版本的 DreamScene2， ...
