HTML4与HTML5的区别 HTML4与HTML5的区别 前言 稀里糊涂学了挺长一段时间前端的，但是一直都是“面向百度的开发”，对一些底层知识掌握得并非很透彻，对开发过程有着非常大的不便，因此对部分前端基础知识进行对比与记录，供日后复习巩固。 什么是HTML，HTML4，HTML5？ HTML代表超文本标记语言，用于使用标记语言设计网页。HTML是超文本和标记语言的组合，超文本定义了网页之间的链接；标记语言用于定义标记内的文本文档，该文档定义网页的结构。此语言用于注释（在计算机注释中）文本，以便机器可以理解它并相应地操作文本。 大多数标记（例如HTML）语言都是人类可读的。该语言使用标签来定义必须对文本进行哪些操作。它用于在网页上构造和呈现内容。 HTML4是HTML的第四个版本，HTML4是为了适应PC时代产生的。 HTML5是HTML的第五个版本，HTML5为了适应移动互联网时代产生的，HTML5在HTML4中删除或修改了许多元素。 HTML4和HTML5的区别 由于HTML5的设计目的是在移动设备上支持多媒体，因此HTML5已经远远超越了标记语言的范畴，它和HTML4比起来，深度和广度上都做了进一步提升。 声明文件类型 由上面可以看到，在文档声明上，HTML4的声明代码很长很复杂，而HTML5的声明更为简单，方便记忆，所以HTML5要比HTML4更有利于程序员的快速阅读和开发。 新的元素 HTML5增加了canvas 元素（绘画）、video 元素（媒体回放）、audio 元素、新的特殊内容元素（article、footer、header、nav、section）、表单控件（calendar、date、time、email、url、search），比如之前用div现在可以用HTML5结构化标签代替，这样使整个页面更加直观，容易理解。 HTML5强大的绘画功能，加上JavaScript即可实现动画以及图片等效果，这些都是HTML4做不到的。例如Canvas和SVG，在HTML5中，Canvas和SVG可以进行绘图，Canvas相当于一个画布，可以通过JavaScript 来绘制 2D 图形，Canvas 是逐像素进行渲染的。SVG是可伸缩矢量图形，用于定义网络的基于矢量的图形，SVG 严格遵从 XML 语法，其图像文件可读并且易于修改和编辑，可以被搜索、索引、脚本化或者压缩。可以在任何分辨率下被高质量地打印。 SVG与Canvas区别 SVG适用于描述XML中的2D图形的语言 Canvas随时随地绘制2D图形(使用JavaScript) SVG是基于XML的，这意味着每个元素在SVG DOM中都可用。你可以为每个元素添加JavaScript事件处理程序 在SVG中，每个绘制的形状都会被记忆为一个对象。如果SVG对象的书香发生变化，浏览器可以自动重新渲染形状。 Canvas是一像素一像素地渲染。在画布中，一旦图形绘制好了，就会被浏览器遗忘。如果你想改变某一个的位置，整个场景都需要重新绘制，包括可能已经被图形覆盖的任何对象。 Canvas SVG 与分辨率相关(可以理解为位图，图形放大会失真看到一个个像素点)…
昨天老板稀奇地留下来加班，想着还有衣服没洗 就回去早了些。刚把衣服塞进洗衣机，躺在外面走廊的摇篮秋千里，听着歌。手机振动，微信有了消息。 与自己一样的新实习生询问我是否还在公司。知道我不在之后，倒也没客套几句，直接拜托我去帮她开个电脑，她打算在家远程把未完成的工作补上。 并不想去，尽管就我离得最近，单车20分钟的距离，但来回也挺累人的，于是我拒绝了，毕竟这个想法有些疯狂。 可能是我低估了对方的疯狂，要了我的位置后立马给我叫了一个滴滴。此时，脑子里除了惊叹，剩下的就只是疑惑了，不知何时，早已把“麻烦”甩在脑后，没带感情的上了车。 并没有抱怨，也没有生气。因为我困惑了。且不说她与我并非很熟，但拜托一个人大老远过去只为了帮她开个电脑，这个举动还是很疯狂的。我困惑的是，她为什么会如此疯狂？ 真的和她说的那样，担心任务到后面越来越多？还是担心会被老板训斥，甚至“开”了？也许都是。 老板什么都没做，小公司像极了大学里的小团体，每个人各司其职。老板人很好，没有表露出非常难以接近的气场，说话语气也十分柔和。发布任务时，并没有和我们解释太多，给了ddl，就做自己的事情了。即使临近ddl，也没有任何表示。似乎和自己无关一样，全凭我们自己做完，然后提交。不管我们是在工作，还是抱着手机聊天，戴着耳机听歌，无聊的刷着网页，他看到与没看到，至始至终，都从未过问过一句。 我由于某些原因，需要尽最大努力尽快把任务完成，然后挤出时间做自己的事情，因此我很快就把自己任务完成。而其余同事，大多都在摸鱼。仿佛任务没做完，老板会想办法解决一样。我也以为，这种场景和员工的这些心态，是自然而然的。 我当然知道这样的场景和心态并不正常，我只是开始以为现在的人都是这样的罢了。 但另一个实习生，让我有些困惑。明明老板什么都没做，甚至在我眼里看来，“这个老板有点不负责任”。结果却很“轻松”地解决了这件在我心中堵了很久很久的“团队积极性”的问题 。甚至能让这位实习生做出如此疯狂的举动，着实让我费解。 是因为老板看似“不靠谱”的背后有着必胜的把握，还是这位实习生的性格就是如此呢？ 暂时仍然不得为知。 询问了一些前辈，前辈并没有过多解释，只说了两个字——利益。
你好，玻璃拟态 Glassmorphism 你好，玻璃拟态 Glassmorphism 1. 前言 去年这时，新拟态在设计圈内掀起一波热潮，介于阴影与扁平化风格的新UI无疑让所有人眼前一亮。各大平台纷纷有人发布类似作品。 我也曾跟风制作过一些小demo，也专门写过一篇文章来介绍新拟态风格：新拟态如何用 Adobe XD 实现。当时就已经觉得，新拟态虽然很新奇，但缺点也非常明显，对比度低的特点，会给一些存在视觉障碍的人造成困扰，注定造成了它不能真正占据主流设计市场。 可是尽管缺点很明显，但我仍然还是在2020年使用这种风格做了非常多的东西。从起初的原型，PPT到手机主题，微信模块，再到博客，web题库等等。 PPT请见：https://www.bilibili.com/video/BV1v54y1a78C/ 前段时间，网络上又掀起一波毛玻璃风。其实是因为苹果发布的 MacOS Big Sur 操作系统引起了轩然大波。 因此，最近使用这个风格，也做了一个网站。借着此次体验，也记录一下玻璃拟态的效果。 2. 成品 平日里写博客和做网站的时候，喜欢加一下好玩的emoji表情。有了丰富的表情，自然就让整篇文章趣味性更强，但是寻找的时候总是不太方便。起初是在EMOJI CHEAT SHEET这个网站上复制，用在markdown文档里非常合适。但是敲代码的时候，这些就不适合了。虽然经常可以看到一些网站上使用非常好玩的emoji，但是并不知道他们是从哪里获取的，只能需要什么表情的时候就在百度上搜索，实在很不方便。因此就打算做一个，正好使用这个玻璃拟态风格。 成品截图奉上： 在线链接：MyEmoji 3. 正文 3.1 毛玻璃的历史 其实毛玻璃大家肯定是不陌生的。最早的毛玻璃视觉其实可以追溯到2007年微软发售的 Windows Vista和Windows7，随之后来的OS X…
