11 个有用的 JavaScript 和 CSS 库

Posted 2021-04-17 极客小寨

每日推荐

高质量的网页设计需要直观和用户友好的界面，而且屏幕上的元素也起着非常重要的作用。Web 设计师不断地寻找优秀代码的集合，希望能提升工作效率。但找到合适的工具库并不总是那么容易的。网络上有太多的资源可以使用。

1

前言

无论是希望创建一个视觉上吸引人和功能强大的布局，还是需要在表单和其他区域添加屏幕上的规则和验证，你都会喜欢这个集合。这里列出的库是由具有丰富网页设计经验的专家创建的，这些库不仅是经验丰富的设计师的优秀工具，也是适用于初学者的好工具。这个集合将会帮你节省很多时间，来看一看吧！希望对大家有些帮助吧！

2

Buefy

Buefy

适用于 Vue.js 项目的轻量级 UI 框架，使用流行的基于 flexbox 的 CSS 库 Bulma 构建。它具有典型的 Web APP 所需的全部组件，包括像模态框、吐司和通知这样的动态元素，使开发者可以快速添加任何用户界面到现有的 Vue.js 项目。

3

HR.js

HR.js

零依赖库，用于在 DOM 中以编程的方式高亮显示并替换字符串，HR.js API 的使用不能再简单了 — 只需使用 CSS 选择器来定位目标文本的父 html 元素，选择要突出显示的单词，设置背景颜色，然后就完成了！

4

React VR

React VR

React VR 是为 VR 应用而创建的框架，运行在 Web 浏览器中。它将现代 API（例如 WebGL 和 WebVR）与 React 的声明能力结合起来，通过各种设备提供适用于消费者的体验。

5

Tippy.js

Tippy.js

轻量的纯 javascript 动态提示工具插件库。它提供了大量的不同悬停效果和超过 20 个可定制的选项。Tippy.js 是超级轻量的，并且具有相当不错的浏览器兼容性，当不被支持时会自动回退到常规的 title 属性。

6

UIkit

UIkit

优秀的 CSS 和 JavaScript 前端框架，包括 SVG 图标字体和几十个组件。无论是外观还是作为一个框架，UIkit 的设计都非常好，它具有统一的样式，易于记忆的 API，许多自定义选项和有用的修饰符类。文档也是写得十分好。

7

Across Tabs

Across Tabs

用于在浏览器选项卡之间进行通信的 JavaScript 库，使一个网页可以打开和关闭其他浏览器选项卡。父选项卡可以访问有关其子选项卡的有用信息，包括唯一的 ID 以及子选项卡是否仍然打开或已关闭。

8

Stylelint

Styleline

Stylelint 是一款现代化的 CSS linter，可帮助团队在样式表中强制使用客观的 CSS 标准。该库非常强大，可以禁用或列出特定属性，捕获错误和识别 SCSS 语法。StyleLint 是完全可定制的，可以选择添加新规则或移除你不认可的规则。

9

React-Datasheet

React-Datasheet

React 组件用于向应用添加功能齐全的类 Excel 数据表格。表格单元可以自由编辑、分组选择、复制、粘贴、删除，以及你期望的其他任何功能。其 GitHub 主页上有三个有用的例子 —— 一个基本的表格、带有公式的 spreadsheet，以及带有嵌套组件的表格。

10

Simple Icons

Simple Icons

收集了大量社交网络、app、服务和其他品牌的免费图标。因为所有的图标都是使用 SVG 制作的，所以它们可以缩放到任何的尺寸而不用担心变模糊。基于 SVG 还使得它们非常轻量 — 大多数低于 500 bytes，具有更多细节的大约为 1、2KB。

11

Weex

Weex

Weex 是构建跨平台移动应用的框架，类似于 React Native，但适用于 Vue.js 项目。它可以让你使用 HTML，CSS 和 JavaScript 编写应用，然后在 android 中将其渲染成 Java 或在 ios 中将其渲染成 Swift。该框架有许多内置组件、API 和其他有用的功能。

推荐阅读：

上一篇：

欢迎关注投稿~