CSS笔记分享网页前端后台技巧(CSS+HTML)Web前端之路

CSS 开源资源大全收集

2017-01-15  本文已影响206人  跨境工具箱

CSS 资源大全,包括:预处理器、框架、CSS结构、代码风格指南、命名习惯、播客、演讲视频、大网站的 CSS 开发经验等等。

预处理器

更快地编译 CSS

GCSS– 一个用GO语言编写的CSS预处理器。

LESS– 向下兼容CSS并为当前的CSS增加额外的功能。

Myth– 只用写纯CSS而不用担心浏览器加载缓慢。

PCSS– 一个用Python语言编写的CSS预处理器。

PostCSS– 通过JS插件来转换CSS

Sass– 成熟、稳定且强力的专业CSS扩展语言

Stylus– 用于nodejs的直观、强健、极具特色的CSS语言

YACP– 另一种CSS预处理

这里有一个 CSS 预处理器汇总

框架

960 Grid System– 简化了web开发工作流程

Blueprint– 这个CSS框架为你提供易用的栅格系统、符合直觉的排版功能、有用的插件以及可打印的样式

Bootstrap– 最流行的HTML、CSS、JS框架

inuit.css– 强力的、可扩展的、基于Sass的、采用BEM命名的面向对象CSS框架

Foundation– 一个高级响应式前端框架

Material Design Lite– 很好的用于制作Material Design风格网站的框架

Materialize– 基于Material Design的现代响应式前端框架。

Pure.css– 一套可用于所有web项目的小型响应式CSS模块

Semantic UI– 使用人性化html的强力框架。

Skeleton– 一个超简单的响应式模板。

UIkit– 适用于手机、平板以及电脑端的栅格系统。

工具集

Basscss– 一个基本元素样式与不可修改工具轻量级集合

Bourbon– 用于Sass的简单且轻量的混合库

Corpus– 另一个CSS工具集

Susy– 用于Sass的响应式工具集。

CSS结构

RSCSS– CSS样式结构的合理标准

ITCSS– 用于大型UI项目的稳定、可扩展、可控制的CSS架构

CSS标准化

Normalize– 一套提供较好的多浏览器默认样式一致性的CSS规范

Normalize-OpenType– 为Normalize.css添加了OpenType特性,如连字、字间距等等。

Reset– 一套CSS标准,将全部的HTML元素调整到一致的基准线

sanitize.css– 一套可立即使用的,符合当今最优实践的CSS规范。

大型网站的CSS开发

Github 的 CSS方案

CodePen 的 CSS 方案

Lonely Planet 的 CSS 方案

Groupon 的 CSS方案

Buffer 的 CSS 方案

HOOTSUITE 的 CSS 方案

我们是如何精简 Trello 的 CSS 架构的

Bugsnag 的 CSS 架构

Ghost 的 CSS 方案

Medium 的 CSS 方案

代码风格指导

编写符合语言习惯的 CSS

CSS 指南

Sass 指南

Mark Otto 编写的风格指南,受「GitHub 风格」和「编写符合语言习惯的 CSS」所激发

ThinkUp 的 CSS 风格指导

Google 的 HTML/CSS 风格指导

WordPress 的 CSS 代码标准

风格指导

Atlassian 官方 UI 文档

设计元素

GitHub 的 CSS 风格指导

Patterns

Lighting Design System

SASS 风格指南

星巴克的风格指南

关于网站风格指导的一些资源

命名习惯和方式

Atomic OOBEMITSCSS

BEM

SMACSS

Point North

ITCSS

OOCSS

Title CSS

idiomatic-css

Atomic Design

SUIT CSS

Kickoff CSS

原文链接:http://www.kubiji.cn/topic-id3159.html

上一篇下一篇

猜你喜欢

热点阅读