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

Links

来自网络的我们正在阅读并有一些想法的东西。 有我们应该知道的链接吗? 告诉我们!

Sketch 3.6

🔗 http://blog.sketchapp.com/post/140274303215/sketch-36
阅读评论

Sketch 最新版本中有一些很棒的改进,你可能没有注意到:基线修复、对字距的更好控制、遮罩改进以及更紧凑的 SVG 导出只是一些功能。

很高兴看到该团队今年还计划了一系列排版改进。

Draft.js

🔗 https://fbdocs.cn/draft-js/
阅读评论

Facebook(看起来主要是 Isaac Salier-Hellendag)发布了看起来非常棒的用 React 编写的富文本编辑器。

同理

  • TinyMCE 是那个已经存在很久的编辑器。
  • ProseMirror 是 Marijn Haverbeke 推出的一个相当新的编辑器。
  • ZenPen 是 Tim Holman 设计的一个超级简化的编辑器。
  • 已经有很多尝试复制 Medium 编辑器,比如这个。

如果你不太关心即时视觉格式化(即你只需要一个简单的 Markdown 编辑器),那么你可以搜索很多其他更简单的选项。 如果你也不需要小辅助按钮,那么始终有<textarea>。

Peak 风格指南

🔗 http://bradfrost.com/blog/post/peak-style-guide/
阅读评论

Brad Frost 回应了上周的时事通讯,我在其中提到风格指南并不需要成为让全世界都能看到的漂亮展示。

但我认为 Chris 提到的这些风格指南徽标和吉祥物不仅仅是无端的视觉装饰。 它反映了组织致力于创建和维护一个周到、精心设计的系统。

我的担忧不是那些花哨的风格指南本身就是一个问题,而是其他组织看到它们就会想“我们没有时间或资源来做这个”。

在大型应用程序中管理排版

🔗 http://csswizardry.com/2016/02/managing-typography-on-large-apps
阅读评论

Harry Roberts 建议对 h1-h6 使用非常少的样式,然后使用特定于标题的类名来实际设置它们的样式,而不管它们最终是什么元素。

我赞同这一点。 在过去,我一直使用 .h1、.h2 等而不是使用标签选择器,但实际上,你可以直接给它们命名。

新的网络排版

🔗 https://robinrendle.com/essays/new-web-typography/
阅读评论

我们自己的 Robin Rendle 写的一篇文章。 一个关于过去排版师、他们留下的想法以及它们在当今截然不同的语境中意味着什么的故事。

我对屏幕没有像对使这些屏幕值得拥有的网络那样多的同理心。

赞助:你可能赚多少钱?

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

如果你想知道你的价值,Hired 找到了答案:根据来自数千个真实面试请求和工作机会的数据,我们整理了一个薪资计算器,它可以根据你的技能告诉你你在这份工作中可能赚多少钱。

如果你想知道你实际上可以赚多少钱,请加入 Hired。 只需设置你的个人资料,公司就会在你面试之前向你提供带薪资和股权的工作机会。 使用 1 个申请即可获得来自顶级公司的多个工作机会。 立即尝试 Hired!

使用 calc() 模拟媒体查询

🔗 https://medium.freecodecamp.com/the-fab-four-technique-to-create-responsive-emails-without-media-queries-baf11fdfa848#.qn28y65bx
阅读评论

Rémi Parmentier 的一个真正的 CSS 技巧。 它是在电子邮件的背景下使用的,但它本身就是一个巧妙的技巧。

这是技巧

/* When parent is 500px wide... */
.block {
  min-width: 50%;   /* 250px WINNER */
  max-width: 100%;  /* 500px */
  width: calc(480px - 100%) * 480); /* -9600px */
}

/* When parent is 400px wide... */
.block {
  min-width: 50%;  /* 200px */
  max-width: 100%; /* 400px WINNER */
  width: calc(480px - 100%) * 480); /* 38400px */
}

简化演示。

介绍向量网络

🔗 https://medium.com/figma-design/introducing-vector-networks-3b877d2b864f#.685mgd6a5
阅读评论

正在开发即将推出的设计工具 Figma 的团队展示了向量路径制作的工作方式。 想想 Adobe 软件中的钢笔工具,重新思考。 这种新方法看起来确实更直观,尤其是在曲线可以轻松操作的方式方面。

清晰度(风格指南大会)

🔗 http://clarityconf.com/
阅读评论

Jina Bolton 正在 3 月底在旧金山举办这场全新的会议,我将担任主持人!

10% 折扣,优惠券代码“CodePen”

嘿,看看今天是什么日子

🔗 https://css-tricks.cn/international-box-sizing-awareness-day/
阅读评论

我最喜欢的自我宣告的节日之一。

有趣的小知识。 它被认为是 CSS 工作组的一个错误。

box-sizing 应该默认设置为border-box。

Quick Hits

# 2024 年 8 月 23 日
# 2024 年 8 月 21 日
# 2024 年 8 月 14 日
# 2024 年 8 月 14 日
更多快速提示 →
  • 较新
  • 1
  • ...
  • 128
  • 129
  • 130
  • ...
  • 219
  • 较旧

CSS-Tricks 由 DigitalOcean 提供支持。

随时了解 Web 开发动态

通过我们精心制作的时事通讯

DigitalOcean
  • 关于 DO
  • Cloudways
  • 法律事项
  • 获得免费积分!
CSS-Tricks
  • 为我们写文章!
  • 与我们合作广告
  • 联系我们
社交媒体
  • RSS 订阅
  • CodePen
  • Mastodon
  • X
返回顶部

© 2024 . All rights reserved.