跳至主要内容
CSS-Tricks
  • 文章
  • 笔记
  • 链接
  • 指南
  • 年鉴
  • 随机
搜索

Links

我们正在阅读的一些网络内容,以及我们的一些想法。 有我们应该知道的链接吗? 告诉我们!

赞助商:Hack Reactor – 新远程测试课程

🔗 http://synd.co/1Az6W6K
阅读评论

随着其第一个在线学员的成功,Hack Reactor 很高兴地宣布两个新的远程测试课程。 有志工程师不再需要搬迁到旧金山才能参加他们为期 12 周的沉浸式 JavaScript 编码学校。 在家参加 Hack Reactor 的课程,获得构建出色产品的技能和信心。

远程测试课程于 10 月 27 日和 12 月 8 日开始,推荐的申请截止日期分别为 9 月 29 日和 11 月 10 日。 立即申请,无论身在何处,都能参加他们卓越的远程测试课程!

AMCSS

🔗 http://amcss.github.io/
阅读评论

“CSS 属性模块”

Glen Maddern 的一个想法,用于通过属性而不是类来移动样式。 这不是一个全新的概念,但有趣的是给它命名并解释一个基于它的系统。 想法

  • 它避免了命名空间。 使用诸如“large”之类的修饰符通常是一个诱人的命名约定,但对于类名本身来说过于笼统。 “Large” 作为属性值是可以的,例如 am-Button="large"
  • HTML 侧更干净,CSS 侧更混乱。
  • 从技术角度来说,可能更慢的 CSS 选择器,但这已在反复证明,除了极端情况外,几乎没有区别。
  • 在构建具有变体的框架或模式库时,它可能最有意义。 使用这种方法来构建网站的这些部分是可以的,而你的日常样式并不需要。
  • 我喜欢它听起来像穴居人说话。 <i am-Ogg="you jane.">

赞助商:Frontend Masters – 专家级 Web 开发培训

🔗 http://synd.co/1zGf3Om
阅读评论

Frontend Masters 由行业领袖(如 Kyle Simpson、Douglas Crockford 和 Estelle Weyl)提供高质量的视频培训。 我喜欢这些课程针对中级和高级开发者。

你已经掌握了基础知识,不想从只是向你灌输 Google 搜索结果的老师那里学习,你想要从大师那里学习! 在这里,你获得的老师是专家,是正在积极塑造行业的人。

通过 Frontend Masters 课程提升你的 JavaScript、CSS 和前端技能。 查看 完整的课程列表。

原生 CSS 变量的优势

🔗 http://www.broken-links.com/2014/08/28/css-variables-updating-custom-properties-javascript/
阅读评论

我倾向于认为变量最好留给预处理步骤,但将它们直接放在 CSS 中可以做一些独特的事情

  1. Daniel Imms

    [它们]可以在运行时更改,从而允许以更优雅的方式实现主题化等功能。

    例如,更改实时渲染网页上变量的值,并查看更改反映在使用该变量的所有位置。

  2. Peter Gasston

    你可以通过样式对象上的 setProperty() 方法设置值

    这使得 #1 成为可能,并开辟了令人兴奋的可能性。

  3. 它们可以作用域到某个元素。 因此,你也许可以设置表示颜色的变量来为网站设置主题,但可以在组件级别覆盖它们,以便根据需要在较小的位置应用不同的主题。

赞助商:Hack Reactor – 最初的 JavaScript 编码学校

🔗 http://synd.co/1q8Fpn6
阅读评论

Hack Reactor 是一家为期 3 个月的沉浸式编码学校,专注于计算机科学基础知识和 JavaScript。 Hack Reactor 秉持双重使命,致力于通过快速迭代教学来赋能个人,变革教育。 Hack Reactor 毕业生在 Google、Adobe、OpenTable、Amazon 以及众多初创公司工作,平均起薪为 105,000 美元,毕业生就业率为 99%。

我个人认识一位参加编码学校并改变职业和人生的人,所以我相信这一点。 立即申请,获得构建出色产品的技能和信心。

赞助商:面向开发者的 RSS 阅读器

🔗 http://synd.co/1pgLdOS
阅读评论

rssheap 是一款面向软件开发者的基于 Web 的阅读器。 你订阅感兴趣的标签(CSS、JavaScript、PHP、Ruby 等),我们会为你找到很棒的文章供你阅读。 文章按投票数排序,以确保你始终阅读高质量的内容。

我认为这是一个巧妙的想法。 它比传统的 RSS 阅读器更容易,因为你在注册后就能立即看到内容,并且可以社交地找到内容。 与传统的新闻聚合网站相比,它也有优势,因为你可以将内容标记为已读并根据自己的喜好进行定制。

试试吧,它是免费的!

CSS 指南

🔗 http://cssguidelin.es/
阅读评论

> 为编写理智、易于管理、可扩展的 CSS 提供高级建议和指南

感觉像是 Harry Roberts 过去几年工作的完美总结。

轻松风格

🔗 https://vimeo.com/101718785
阅读评论

一些聪明的东西 在这里,关于仅对普通 HTML(可能是从 Markdown 生成的)内容进行样式设置。 没有任何类或属性,没有额外的 HTML,没有 JavaScript,什么都没有。 这样的内容 1)对任何人来说更容易制作 2)将持续存在。

赞助商:新的 Creative Market 捆绑包! 39 美元即可获得大量设计资源

🔗 http://synd.co/1nxb4gv
阅读评论

Creative Market 销售大量设计资源。 从高质量的库存照片和矢量图到印刷设计和 Web 模板,再到非常奇特的东西,例如 Photoshop 动作,可以轻松获得令人惊叹的效果。

他们偶尔会将一些捆绑资源放在一起,你可以购买这些资源,然后从你的帐户中下载,永远可以使用它们。 它们包含我提到的所有很棒的东西。 单独购买,所有这些东西加起来会很贵。 但仅限本周,整个 大捆绑包 售价为 39 美元!

我喜欢身边有这样的东西。 通常,仅仅浏览一下我拥有的所有东西,就是我开始构建某些东西所需的创意火花。

纯 CSS 视差滚动网站

🔗 https://keithclark.co.uk/articles/pure-css-parallax-websites/
阅读评论

Keith Clark 解释了视差滚动的核心概念(例如,不同的元素以不同的速度滚动),只需要使用 CSS。 这是一个非常巧妙(但简单)的 3D 变换组合,将元素“推离”屏幕,影响其滚动速度,同时调整比例,使元素显示在原始大小。

Scott Kellum 和 Brenna O’Brien 之前做过 Sass @mixin,这使得它变得更加容易。

Quick Hits

# 2024 年 8 月 23 日
# 2024 年 8 月 21 日
# 2024 年 8 月 14 日
# 2024 年 8 月 14 日
更多快速点击 →
  • 较新
  • 1
  • ...
  • 150
  • 151
  • 152
  • ...
  • 219
  • 较旧

CSS-Tricks 由 DigitalOcean 提供支持。

关注 Web 开发最新动态

使用我们精心制作的时事通讯

DigitalOcean
  • 关于 DO
  • Cloudways
  • 法律事项
  • 获得免费信用额度!
CSS-Tricks
  • 为我们撰稿!
  • 与我们合作广告
  • 联系我们
社交媒体
  • RSS 订阅
  • CodePen
  • Mastodon
  • X
返回顶部

© 2024 . All rights reserved.