>

资源大全,前端必备知识

- 编辑:至尊游戏网站 -

资源大全,前端必备知识

CSS 能源大全

2015/12/25 · CSS · 1 评论 · CSS

本文由 伯乐在线 - iLeo 翻译,艾凌风 校稿。未经许可,禁绝转发!
越南语出处:github.com。招待参加翻译组。

sotayamashita 发起维护的 CSS 能源大全,包蕴:预管理器、框架、CSS结构、代码风格指南、命名习于旧贯、播客、解说录制、大网址的 CSS 开辟经历等等。

【特别提示】:伯乐在线已在 GitHub 上发起 CSS 财富大全粤语版的整治,链接:。迎接扩散和到场。

  • 目录
    • 预管理器
    • 框架
    • CSS结构
    • CSS规范化
    • 特大型网站的CSS开辟
    • 代码风格指南
    • 体制指南
    • 取名习于旧贯和措施
    • 参考
  • 在线财富
    • 播客
    • Twitter
    • 视频

Bootstrap,来自推特,是时下非常受款待的前端框架。Bootstrap 是依照HTML、CSS、JAVASC汉兰达IPT 的,它简洁利落,使得 Web 开荒尤其便捷。

预处理器

更加快地编写翻译 CSS

  • GCSS – 三个用GO语言编写的CSS预管理器。
  • LESS – 向下宽容CSS并为当前的CSS扩大额外的法力。
  • Myth – 只用写纯CSS而不用怀想浏览器加载缓慢。
  • PCSS – 多个用Python语言编写的CSS预管理器。
  • PostCSS – 通过JS插件来转变CSS
  • Sass – 成熟、牢固且强力的正统CSS增添语言
  • Stylus – 用于nodejs的直观、强壮、极具特色的CSS语言
  • YACP – 另蒸蒸日上种CSS预管理器

这里有八个 CSS 预管理器汇总。

它由推文(Tweet)的设计员马克 奥托和JacobThornton配合开荒,是三个CSS/HTML框架。Bootstrap提供了文雅的HTML和CSS规范,它便是由动态CSS语言Less写成。Bootstrap龙腾虎跃经推出后颇受招待,一直是GitHub上的销路好开源项目,包涵NASA的MSNBC(微软全国广播公司)的Breaking News都使用了该类型。

框架

  • 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 – 适用于手机、平板甚至Computer端的栅格系统。

境内部分运动开拓者较为纯熟的框架,如WeX5前端开源框架等,也是基于Bootstrap源码实行品质优化而来。

工具集

  • Basscss – 贰个骨干元素样式与不可修改工具轻量级会集
  • Bourbon – 用于Sass的简练且轻量的混合库
  • Corpus – 另一个CSS工具集
  • Susy – 用于Sass的响应式工具集。

课程指标

CSS结构

  • RSCSS – CSS样式结构的合理标准
  • ITCSS – 用于大型UI项指标稳定、可扩张、可决定的CSS架构

支配前端框架Bootstrap的运用

CSS标准化

  • Normalize – 意气风发套提供较好的多浏览器私下认可样式如日中天致性的CSS标准
  • Normalize-OpenType – 为Normalize.css增加了OpenType个性,如连字、字间隔等等。
  • Reset – 龙精虎猛套CSS标准,将全部的HTML成分调节到均等的基准线
  • sanitize.css – 风度翩翩套可立刻采取的,切合于今最优施行的CSS标准。

相符人群

特大型网址的CSS开采

  • Github 的 CSS方案 by Mark Otto.
  • CodePen 的 CSS 方案 by Chris Coyier.
  • Lonely Planet 的 CSS 方案 by Ian Feather.
  • Groupon 的 CSS方案 by Mike Aparicio.
  • Buffer 的 CSS 方案 by Brian Lovin.
  • HOOTSUITE 的 CSS 方案 by Steve Mynett.
  • 我们是何许精简 Trello 的 CSS 架构的 by Bobby Grace.
  • Bugsnag 的 CSS 架构 by Max Luster.
  • Ghost 的 CSS 方案 by Paul Davis.
  • Medium 的 CSS 方案 by Jacob Thornton.

后面一个开垦者

代码风格引导

  • 编纂符合语言习于旧贯的 CSS by Nicolas Gallagher.
  • CSS 指南 by Harry Roberts.
  • Sass 指南 by Hugo Giraudel.
  • 马克 奥托 编写的品格指南,受「GitHub 风格」和「编写相符语言习于旧贯的 CSS」所激发 by Mark Otto.
  • ThinkUp 的 CSS 风格带领,作者ThinkUp
  • 谷歌 的 HTML/CSS 风格指引
  • WordPress 的 CSS 代码标准

最先的作品链接

作风教导

  • Atlassian 官方 UI 文档;
  • 设计成分 by lonely planet.
  • GitHub 的 CSS 风格引导
  • Patterns by MailChimp 的作风指南.
  • Lighting Design System by Salesforce 的风骨指南.
  • SASS 风格指南 by Sass team.
  • 星Buck的风骨指南 by Starbucks.
  • 至于网址风格辅导的局部能源 by Awesome people.

取名习贯和办法

  • Atomic OOBEMITSCSS
  • BEM
  • SMACSS
  • Point North
  • ITCSS
  • OOCSS
  • Title CSS
  • idiomatic-css
  • Atomic Design
  • SUIT CSS
  • Kickoff CSS

参考

  • 可扩展CSS阅读清单

此外能源

播客

编程时得以听的局地剧情。

  • Shop Talk Show – Chris Coyier 和 DaveRupert 的在线播客,涉及前端、UX的规划及费用
  • Style Guide Podcast – 由 Anna Debenham 和 Brad Frost 主持的有的访问。
  • The Big Web Show – 包括了差不离全数 Web 相关的话题,譬如互联网出版、艺术引导、内容攻略、版面设计、Web能力等等。
  • The Web Ahead – 与海内外的大方研讨 Web 技能的生成和升华。
  • Non Breaking Space Show – 发现出那贰个在数字艺术、设计以致支付世界最棒的、最出名的同不常候最精通的创客们。
  • The Changelog – 这么些播客的口号是:“开源发展赶快,快跟上”,致力于让您跟上流行的开源技巧。

Twitter

值得关切的活泼客商

  • CSS Animation
  • Andrey Sitnik – @Autoprefixer, 和 @PostCSS 的作者
  • Evangelina Ferreira – web设计师,@multimedial_utn 的教学,HTML5 & CSS纵情的闹饮爱好者,业余翻译者。
  • Sara Soueidan – @Codrops CSS Reference的作者,Smashing Book #5的合著者。
  • Hugo Giraudel – @edenspiekermann 的 CSS 怪才以至 Sass 骇客
  • Guy Routledge – 前端开采者、@GA_London 的教师, 的录像小编,土憋,吃货。
  • Heydon Pickering – 爱吃香米,同一时间也是贰个UX设计员,小编,@smashingmag 编辑以至程序猿。
  • Adam Morse – 开源的粉丝和扶助者
  • Donovan Hutchinson – 设计师、开发者、作家。偶尔在
  • CSS Commits – 这段日子坚苦 CSSWG 的公家 Mercurial 库
  • Scott Jehl – responsiblerwd 的撰稿人,以往 abookapart上 面在降价
  • Dudley Storey – Web开辟者、作者、老师甚至演讲者。
  • Zoe M. Gillenwater – Web设计员、开拓者,潜心于CSS、途乐WD、UX以致无障碍开荒。
  • Ben Briggs – 重要钻探node.js、javascript、开源模块、顾客端优化、web质量相关。
  • Paul Lewis – 将代码与设计联系起来的Google职工。
  • Thierry Koblentz – Yahoo 的 CSS 开发者
  • Nicolas Gallagher – 推特(TWTR.US)的软件程序员
  • Harry Roberts– @google, @Etsy, @kickstarter, @BBC, @Deloitte, @FT等的前端设计顾问
  • Phil Walton -谷歌(Google)技术员、开源拥护者、开荒者、设计师、写手。
  • Lea Verou – MIT_CSAIL, @CSSWG IE, @OReillyMedia小编的钻探助理,前W3C职员和工人
  • Manoela Ilic – CSS和HTML是本人的画笔,小编对认知科学、AI、HCI、UI设计以至天体物经济学很感兴趣,数码控。
  • Una Kravets – BMDesign以至Sassvocate的前端程序员,团队建设者以至手工业艺者。座右铭:全体东西都应该开源!
  • Chris Coyier – CodePen的设计师,Real_CSS_Tricks作者
  • Nicole Sullivan – 极客!
  • Eric Bidelman – Google的程序猿,参加项目有Chrome、web组件、Polymer
  • Patrick Hamann – 热爱登山、米酒以至美味。
  • Dave McFarland – Web开发者,《CSS: The Missing Manual》和《JavaScript & jQuery:  The Missing Manual》的作者,
  • L. David Baron – Mozilla开发者,CSS以及W3C标准的「外交官」。
  • Daniel Glazman – W3C的CSS工作组织一起主席,集团家,软件程序猿,极客,四个男女的生父,明白多国语言,喜欢秋沙鸭。
  • The Chris Eppstein – 爱恨鲜明,家庭幸福,写代码,主导 LinkedIn 的体裁。
  • Natalie Weizenbaum – 女程序猿,SassCSS 的主设计员和开辟者,在Google做 Dart 语言相关专门的学问。
  • Brad Frost – Web设计师、演讲者、写手、顾问、音乐家。
  • Maxime Thirouin – 前端程序员,自由专门的学问者,UI/UX开采者。
  • Mark Otto – 在GitHub和Bootstrap职业,曾就职于照片墙,一级书傻帽。
  • Simon – UI设计师,CSS开发者
  • Connor Sears – GitHub设计师
  • Remy Sharp – 他的推都以有关CSS尺寸单元的
  • Jonathan Snook – 设计员、开拓者、写手、演讲者。笔者在网络做些东西,小编写的SMACSS。

视频

一个很有用的必须要看录像清单,那个清单是从 908a28 的 AllThingsSmitty/must-watch-css 复制过来的,笔者已经在脸谱上跟她说了,特别谢谢!

2015

  1. mdo-ular CSS: Mark Otto, jQuery UK 30:06.
  2. CSS Architecture with SMACSS: Caleb Meredith, DevTips channel 30:15. 用SMACSS搭建CSS结构
  3. CSS Workflow from the Ground Up: Jonathan Snook, Generate conf 2015 46:06. 从头起头学习CSS专门的学业流

2014

  1. What Is a CSS Framework Anyway? | 毕竟怎么是CSS框架?: Harry Roberts, Industry Conf 48:48.
  2. CSS Is a Mess | 理伙不清的CSS: Jonathan Snook, Beyond Tellerand 53:49.
  3. 10 Commandments for Efficient CSS Architecture | 高效CSS结构十诫: Kushagra Gour, CSSConf.Asia 35:55.
  4. Slaying the Dragon: How to Refactor CSS for Maintainability | 杀掉巨龙:从可维护性方面思考什么重构CSS: Alicia Liu, Front-Trends 33:21.
  5. CSS in Your Pocket – Mobile CSS Tips from the Trenches | 口袋中的CSS-移动端CSS开垦主旨: Angelina Fabbro, CSSConf.US 34:19.
  6. Styling and Animating Scalable Vector Graphics with CSS | 用CSS制作可扩充的矢量图动画: Sara Soueidan, CSSConf.EU 29:16.
  7. Play Nice With CSS Tools and Methodologies | 学会运用CSS工具和方法: Brad Westfall, HTML5DevConf 42:47.
  8. CSS and the Critical Path | CSS以致关键路线: Patrick Hamann, CSSConf.EU 33:42.
  9. All the Right Moves: How to Put Your UI in Motion | 走好每一步:如何让您的UI动起来: Val Head, Multi-Mania 45:49.
  10. Present and Future of CSS Layout | CSS布局的升华: Tab Atkins, CSS Day 49:31.
  11. Thinking Beyond “Scalable CSS” | 关于可扩充CSS的想想: Nicolas Gallagher, dotCSS 28:46.
  12. Web Components & the Future of CSS | WEB组件以致CSS的今后: Philip Walton, SFHTML5 40:02.
  13. CSS Performance Tooling | CSS品质工具: Addy Osmani, CSSConf.EU 46:27.
  14. 3.14 Things I Didn’t Know About CSS3 | 关于CSS,小编所不清楚的14件事: Mathias Bynens, CSS Day 45:35.
  15. Effortless Style | 轻易的体裁: Heydon Pickering, CSS Day 49:51.
  16. CSS: Yawn to Yay! | CSS:从无聊起地道 Kyle Simpson, Front-Trends 39:04.

2013

  1. When Bootstrap Attacks | 当Bootstrap最先发力: Pamela Fox, CSSConf.US 28:48.
  2. CSS in the 4th Dimension | CSS是第四维: Lea Verou, JSConf.Asia 44:49.
  3. Automated CSS Testing | 自动化CSS测试: Jakob Mattsson, JSConf.Asia 42:07.
  4. CSSConf.EU Keynote | CSSConf.EU的基调: Nicole Sullivan, CSSConf.EU 20:57.
  5. CSS Application Architecture | CSS的行使架构: Nicolas Gallagher, SmashingConf 38:36.
  6. Realigning & Refactoring UI | UI的调动和重构: Jina Bolton, SassConf 48:08.
  7. Normalizing Designs for Better Quality CSS | 进步CSS品质的标准化设计: Harry Roberts, CSSConf.EU 43:40.
  8. Automating the Removal of Unused CSS | 自动清除无用的CSS: Addy Osmani, Velocity Europe Conference 5:57.
  9. The Humble Border-Radius | 低调的Border-Radius: Lea Verou, Future of Web Design 37:07.
  10. The Mind-blowing Power of Sass 3.3 | Sass那印象深远的工夫: Chris Eppstein, CSSConf.EU 38:54.
  11. Front-End Tools for the Young Developer | 年轻开辟者的前端工具: Christian Vuerings, SF HTML5 User Group 14:16.
  12. Maths-Powered Transforms for Creating 3D Shapes | Maths-创立3D图形的暴力调换器: Ana-Maria Tudor, CSSConf.EU 30:27.
  13. Sass and OOCSS Sitting in a Tree K-I-S-S-I-N-G | Sass和面向对象CSS完美搭配: Nicole Sullivan, TXJS 27:50.
  14. CSS Levels Up | 提升CSS等级: Angelina Fabbro, CSSConf.EU 31:38.
  15. Architecting Scalable CSS | 搭建可增加的CSS: Harry Roberts, Beyond Tellerand 41:57.
  16. More CSS Secrets: Another 10 Things You May Not Know about CSS | 越多的CSS秘密:CSS无人问津的别的10件事: Lea Verou, W3Conf 60:39.
  17. Atomic Cascading Style Sheets: Renato Iwashima, HTML5DevConf 52:33.

2012

  1. Open Source Tools and Libraries for Designers | 设计员的开源工具以至能源库: Julie Ann Horvath, HTML5DevConf 29:39.
  2. GitHub’s CSS Performance |  GitHub的CSS表现: Jon Rohan, CSS Dev Conf 40:50.

2010

  1. Handcrafted CSS | 手写CSS: Dan Cederholm, Build Conference 44:29.
  2. The Top 5 Mistakes of Massive CSS | 大规模CSS中最轻便并发的5个谬误: Nicole Sullivan, Build Conference 37:53.

【非常提示】:伯乐在线已在 GitHub 上发起 CSS 财富大全中文版的横盘,链接:。应接扩散和到场。

3 赞 21 收藏 1 评论

有关小编:iLeo

图片 1

性别:男,单身前端新手生机勃勃枚,近日在罗利事业,首要做活动端的web开辟。喜欢的一句话:长久都要保持一个初读书人的刺激。天涯论坛:@文_车_Leo_sCript 个人主页 · 小编的篇章 · 12

图片 2

本文由硬件数码发布,转载请注明来源:资源大全,前端必备知识