有哪些类似bootstrap的纯css框架?

前言

下面是一些类似bootstrap的css框架,以及其开源的仓库和网址附上,整理不易,希望多多点一下赞同收藏喜欢哈~

1、Tailwind

Star:70.5k

Tailwind CSS 是一个实用的工具集,用于快速构建现代化的自定义用户界面。它提供了一系列预定义的样式类,可以直接应用于 HTML 元素上,从而减少了手动编写 CSS 的工作量

github地址:https://github.com/tailwindlabs/tailwindcss

官网:https://tailwindcss.com/

2、 HTML5 Boilerplate

Star:54.9k

"html5-boilerplate"是一个流行的HTML5项目模板和开发框架。它提供了一个预先配置好的HTML、CSS和JavaScript文件的基础结构,使得开发者可以快速开始构建一个现代化的、响应式的网站或应用程序

github地址:https://github.com/h5bp/html5-boilerplate

官网:https://html5boilerplate.com/

3、 Semantic UI

Star:50.7k

Semantic-UI是一款开源的现代化的 前端框架,它用于构建用户界面。它使用语义化的HTML来构建页面布局,并提供了丰富的CSS样式和JavaScript组件,以便开发人员能够快速、高效地构建出美观、易于使用的网页和应用程序

github地址:https://github.com/Semantic-Org/Semantic-UI

官网:https://semantic-ui.com/

4、 Bulma

Star:47.4k

Bulma是一个现代化的CSS框架,用于构建响应式的、移动优先的Web界面。它基于Flexbox布局,并提供了一组易于使用的预定义样式和组件,包括按钮、表格、表单、导航等。Bulma的设计风格简洁、精致,并且高度可定制,允许开发人员根据自己的需求进行个性化调整

github地址:https://github.com/jgthms/bulma

官网:https://bulma.io

5、Materialize

Star:38.8k

Materialize是一个现代化的 响应式前端框架,提供了一套用于构建各种Web应用程序和网站的CSS和JavaScript组件。它基于Google的Material Design设计原则,具有丰富的可定制化选项

github地址:https://github.com/Dogfalo/materialize

官网:https://materializecss.com/

6、 Pure

Star:23.1k

"pure-css"是一个开源的CSS库,它提供了一系列轻量级、可定制的CSS模块,用于构建现代化的网页界面。它致力于提供简洁、灵活和易于理解的CSS代码,同时避免使用过多的JavaScript。这样可以帮助开发者快速地创建具有 响应式布局和现代风格的网页。pure-css的设计理念是通过精简CSS代码来提高网页性能,并鼓励开发者编写更具语义性和组件化的CSS

github地址:https://github.com/pure-css/pure

官网:https://purecss.io/

7、 Skeleton

Star:18.9k

Skeleton是一个非常简便、响应式的起步框架,用于移动友好的开发

github地址:https://github.com/dhg/Skeleton

官网:http://getskeleton.com/

8、 UIkit

Star:17.9k

UIkit包含了一套用户界面元素、图形绘制和动画效果等工具,可以帮助开发者构建专业、美观的界面。通过使用uikit,开发者可以轻松地创建按钮、标签、文本框、图像视图等常见的用户界面组件,并且可以通过 自定义属性和方法来实现个性化的设计和交互

github地址:https://github.com/uikit/uikit

官网:https://getuikit.com

9、 Spectre

Star:11.2k

Spectre.css是一个开源的CSS框架,主要用于构建响应式的Web页面。它提供了一系列的CSS类和组件,可以优化网页的外观和交互效果。Spectre.css具有简洁轻量的特点,文件大小较小,并且没有依赖关系。它可以与其他框架和库配合使用,也可以作为单独的框架使用

github地址:https://github.com/picturepan2/spectre

官网:https://picturepan2.github.io/spectre/

10、Metro UI

Star:7k

Metro-UI-CSS是一个基于Metro 风格设计的CSS框架。Metro风格起源于微软公司的Windows Phone和Windows 8操作系统界面设计,注重简洁、平面化及大胆鲜明的颜色和标志性元素

github地址:https://github.com/olton/Metro-UI-CSS

官网:https://korzh.com/metroui

11、Bootflat

Star:4.3k

BOOTFLAT是一个基于Bootstrap 3.3.0 CSS框架的开源Flat UI KIT。它为Web开发人员提供了一种更快、更简便、更少重复的方式来创建优雅的Web应用程序

github地址:https://github.com/bootflat/bootflat.github.io

官网:http://bootflat.github.io/

12、Susy

Star:3.9k

Susy 是一个开源的 CSS 布局框架,它提供了一套灵活而强大的工具,用于创建自适应和响应式的网页布局

github地址:https://github.com/oddbird/susy

官网:https://www.oddbird.net/susy/

持续更新~


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/17057.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

7、单元测试--测试RestFul 接口

单元测试–测试RestFul 接口 – 测试用例类使用SpringBootTest(webEnvironment WebEnvironment.RANDOM_PORT)修饰。 – 测试用例类会接收容器依赖注入TestRestTemplate这个实例变量。 – 测试方法可通过TestRestTemplate来调用RESTful接口的方法。 测试用例应该定义在和被测…

vue2实现一个树型控件(支持展开树与checkbox勾选)

目录 vue2实现一个树型控件(支持展开树与checkbox勾选)TreeItem.vueTree.vue效果 vue2实现一个树型控件(支持展开树与checkbox勾选) TreeItem.vue <template><div class"tree-item"><span click"toggleExpanded" class"icon" v…

Sentinel Dashboard集成Nacos

1.前言 当项目上Sentinel Dashboard做流量监控的时候&#xff0c;我们可以通过Sentinel控制台修改限流配置&#xff0c;但当我们使用Nacos作为配置中心动态配置流控规则的时候&#xff0c;问题就来了。 首先我们要明白&#xff0c;Sentinel Dashboard的配置是从机器的内存中加…

TCP网络通信编程之网络上传文件

【图片】 【思路解析】 【客户端代码】 import java.io.*; import java.net.InetAddress; import java.net.Socket; import java.net.UnknownHostException;/*** ProjectName: Study* FileName: TCPFileUploadClient* author:HWJ* Data: 2023/7/29 18:44*/ public class TCPFil…

【SpringBoot笔记36】SpringBoot自定义WebSocketHandler集成WebSocket

这篇文章,主要介绍SpringBoot自定义WebSocketHandler集成WebSocket。 目录 一、SpringBoot集成WebSocket 1.1、添加WebSocket依赖 1.2、自定义WebSocketHandler 1.3、注册WebSocket服务端

NoSQL--------- Redis配置与优化

目录 一、关系型数据库与非关系型数据库 1.1关系型数据库 1.2非关系型数据库Nosql 1.3关系与非关系区别 1.4非关系产生的背景 1.5总结 二、Redis介绍 2.1Redis简介 2.3Redis优点 2.4 Redis为什么这么快&#xff1f; 三、Redis安装部署 3.1安装redis 3.2测试redis 3.3r…

【论文简述】DIP: Deep Inverse Patchmatch for High-Resolution Optical Flow(CVPR 2022)

一、论文简述 1. 第一作者&#xff1a;Rui Li 2. 发表年份&#xff1a;2023 3. 发表期刊&#xff1a;CVPR 4. 关键词&#xff1a;光流、深度学习、PatchMatch、局部搜索 5. 探索动机&#xff1a;对于深度学习来说&#xff0c;除了准确性之外&#xff0c;性能和内存也是一个…

基于深度学习的CCPD车牌检测系统(PyTorch+Pyside6+YOLOv5模型)

摘要&#xff1a;基于CCPD数据集的高精度车牌检测系统可用于日常生活中检测与定位车牌目标&#xff0c;利用深度学习算法可实现图片、视频、摄像头等方式的车牌目标检测识别&#xff0c;另外支持结果可视化与图片或视频检测结果的导出。本系统采用YOLOv5目标检测模型训练数据集…

回归预测 | MATLAB实现GRNN广义回归神经网络多输入单输出回归预测(多指标,多图)

回归预测 | MATLAB实现GRNN广义回归神经网络多输入单输出回归预测(多指标,多图) 目录 回归预测 | MATLAB实现GRNN广义回归神经网络多输入单输出回归预测(多指标,多图)效果一览基本介绍程序设计参考资料效果一览 基本介绍 MATLAB实现GRNN广义回归神经网络多输入单输出回归…

centos动态内网IP如何改静态

要将CentOS从动态内网IP改为静态IP&#xff0c;需要按照以下步骤进行操作&#xff1a; 打开终端并以root用户身份登录。 编辑网络配置文件。在终端中输入以下命令&#xff1a; vi /etc/sysconfig/network-scripts/ifcfg-eth0 这个命令将打开eth0配置文件。如果您的网络接口…

GitLab备份升级

数据备份(默认的备份目录在/var/opt/gitlab/backups/下&#xff0c;生成一个以时间节点命名的tar包。) gitlab-rake gitlab:backup:create新建repo源&#xff0c;升级新版本的gitlab vim /etc/yum.repos.d/gitlab-ce.repo [gitlab-ce] namegitlab-ce baseurlhttps://mirrors.…

JavaScript将一层级对象数组转为children嵌套的三层级树状对象数组(多级树状分类)

有时候后端返回的数据不适合前端,我们就需要进行转换,比如我想用elementUI的级联选择器,而这个组件对数据格式有要求,本篇文章将介绍如何将一层级对象数组数据格式转为三层级嵌套children数组,JavaScript、Vue、小程序等都适用,使用情景为多级分类,嵌套数据 情况1:原数…

解决el-table打印时数据重复显示

1.表格数据比较多加了横向滚动和竖向滚动&#xff0c;导致打印出问题 主要原因是fixed导致&#xff0c;但是又必须得滚动和打印 方法如下&#xff1a; 1. 2. is_fixed: true,//data中定义初始值 3.打印时设置为false,记得要改回true if (key 2) { this.is_fixed false //打…

虹科活动 | 走进宇通客车-汽车新供应链技术展精彩回顾

引言 7月27日&#xff0c;走进宇通客车-汽车新供应链技术展于宇通研发中心成功举办&#xff0c;本次展会中虹科为大家带来了一体化车载天线与车辆GNSS仿真测试方案&#xff0c;感谢您前来探讨与交流&#xff01; 精彩产品一览 车辆GNSS仿真测试方案 虹科高性能GNSS模拟器具有灵…

Eureka 学习笔记3:EurekaHttpClient

版本 awsVersion ‘1.11.277’ EurekaTransport 用于客户端和服务端之间进行通信&#xff0c;封装了以下接口的实现&#xff1a; ClosableResolver 接口实现TransportClientFactory 接口实现EurekaHttpClient 接口实现及其对应的 EurekaHttpClientFactory 接口实现 private …

Golang之路---01 Golang VS Code创建项目

Golang VS Code创建项目 代码组织 Golang使用包和模块来组织代码&#xff0c;包对应到文件系统就是文件夹&#xff0c;模块就是xxx.go的go源文件。一个包中会有多个模块&#xff0c;或者多个子包。 早期使用的是gopath来管理项目&#xff0c;不方便&#xff0c;比较麻烦&…

电子技术的发展

本资料仅用于学习和讨论如有侵权请反馈 1.1 第一台只能存储640M 什么是模拟信号: 2.1 把声波转化为电信号 2.2 微音器输出的某一段信号的波形 3、最简单有个蜂鸣器,再好一点有个喇叭 4、人说话的声音是个很复杂的声音 5、嵌入式实时操作系统: 6、结构到函数 6.1 学习环境…

深度学习,神经网络介绍

目录 1.神经网络的整体构架 2.神经网络架构细节 3.正则化与激活函数 4.神经网络过拟合解决方法 1.神经网络的整体构架 ConvNetJS demo: Classify toy 2D data 我们可以看看这个神经网络的网站&#xff0c;可以用来学习。 神经网络的整体构架如下1&#xff1a; 感知器&…

二叉树的前,中,后序的非递归实现(c++)

前言 对于二叉树来说&#xff0c;遍历它有多种方式&#xff0c;其中递归遍历是比较简单的&#xff0c;但是非递归的实现就有一定的难度&#xff0c;在这里介绍一种非递归实现二叉树遍历的方式。 1.前序遍历 1.1思路 其实对于二叉树的非递归实现&#xff0c;实际上就是用代码来…

Android HTTP使用(详细版)

前言 在面试过程中,HTTP 被提问的概率还是比较高的。 小林我搜集了 5 大类 HTTP 面试常问的题目,同时这 5 大类题跟 HTTP 的发展和演变关联性是比较大的,通过问答 + 图解的形式由浅入深的方式帮助大家进一步的学习和理解 HTTP 协议。 HTTP 基本概念 Get 与 Post HTTP 特性…