下拉刷新
CSS
Category

Here you can read past volumes of HelloGitHub Monthly by category. You are currently viewing the HelloGitHub CSS collection.

1、
easings.net
Star 7.9k
Fork 667
6 months ago

CSS Easing Functions Cheat Sheet. Easing functions are used to control the speed of CSS animations. This project provides a series of elegant examples of easing functions, along with their effects.

.block {
	transition: transform 0.6s cubic-bezier(0.7, 0, 0.84, 0);
}
easings.net
2、
hyperui
Star 9.5k
Fork 368
7 months ago

Free Collection of Tailwind CSS Components. This project offers a variety of free Tailwind CSS components suitable for websites, marketing, and e-commerce platforms. These components support dark mode, mobile adaptation, and LTR, and can be used by simply copying the code.

hyperui
3、
pokemon-cards-css
Star 5.3k
Fork 492
a year ago

Cool Pokémon Card CSS Effects. This project is a collection of advanced CSS styles for Pokémon cards, employing techniques such as 3D transformations, filters, and gradients to achieve effects like luster, texture, galaxy holographic, and vertical light beams.

pokemon-cards-css
4、
layui
Star 2.9w
Fork 7.3k
a year ago

Web UI Component Library for Back-end Developers. This is a free Web UI component library developed using the native HTML/CSS/JS coding mode. It is easy to use without the need for a build tool, very beginner-friendly, and features a clean and refreshing UI that is highly appreciated by many back-end developers.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>开始使用 Layui</title>
    <link href="./layui/css/layui.css" rel="stylesheet">
  </head>
  <body>
    <!-- HTML -->
     
    <script src="./layui/layui.js"></script>
    <script>
    // 使用组件
    layui.use(['layer', 'form'], function(){
      var layer = layui.layer;
      var form = layui.form;
      
      // 欢迎语
      layer.msg('Hello World');
    });
    </script> 
  </body>
</html>
layui
5、
css
Star 1.3w
Fork 1.2k
2 years ago

GitHub 开源的设计系统。由 GitHub 设计团队开源和维护的项目，包含了 GitHub 的界面设计原则、使用指南和开箱即用的 UI 组件。

css
6、
china_school_badge
Star 918
Fork 38
2 years ago

全国高校校徽字体图标库。该项目包含国内 200 多所高校校徽制作的字体图标。

china_school_badge
7、
daisyui
Star 3.3w
Fork 1.3k
2 years ago

一款极为流行的 Tailwind CSS 组件库。作为当下最流行的 Tailwind CSS 组件库，具有高颜值、更纯净的 HTML、深度自定义等特点。

<ul class="menu p-3 bg-base-200 rounded-xl">
    <li class="menu-title">
      <span>Menu Title</span>
    </li>
    <li><a>First Menu Item</a></li>
    <li><a>Second Menu Item</a></li>
    <li><a>Third Menu Item</a></li>
</ul>
daisyui
8、
css-only-chat
Star 6.6k
Fork 274
2 years ago

仅用 CSS 实现网络聊天。前端不用 JavaScript 只用 CSS 实现网络聊天的功能，秘诀是伪选择器加载的背景图像和永远加载的索引页。

.some-button:active {
  background-image: url('some_image.jpg')
}
css-only-chat
9、
30diasDeCSS
Star 2.9k
Fork 303
2 years ago

在 30 天内用 HTML 和 CSS 创建 30 个迷你项目的挑战。该项目包含了 30 个用 HTML+CSS 构建的迷你项目，每个项目通过动图直观地展示了实现的效果，不仅包含全部源码还指出了用到的知识点。

30diasDeCSS
10、
Cnblogs-Theme-SimpleMemory
Star 3.6k
Fork 1.5k
2 years ago

一款以阅读为主的博客园皮肤。博客园是一个博客平台，它支持用户自定义皮肤。该项目就是一款开源的博客园皮肤，文档有详细的安装步骤，一看就会立马就能用上。虽然皮肤会让博客的访问速度变慢一点，但是皮肤效果简洁好看值得一试。

Cnblogs-Theme-SimpleMemory