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

Links

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

在 CSS 中沿着曲线路径移动

🔗 http://tobiasahlin.com/blog/curved-path-animations-in-css/
阅读评论

motion-path 已在规范中并且已经获得了一些支持。但是,正如 Tobias Ahlin 指出的那样,还有另一种方法可以复制曲线运动路径

…如果我们在我们要动画的对象周围添加一个容器,我们可以为 X 轴应用一个定时函数,为 Y 轴应用另一个定时函数。下面,我们对 X 轴使用 ease-in,对 Y 轴使用 ease-out。

优化 SVG 以供 Web 使用

🔗 https://medium.com/@larsenwork/optimising-svgs-for-web-use-part-1-67e8f2d4035
阅读评论

Andreas Larsen 的一系列深入文章,引导我们了解如何(手动)优化 SVG。他建议了一些软件不太可能为您完成的优化。例如,更改 viewBox 大小以适应简单、圆形的整数。

将此添加到我们的 SVG 信息汇编中。

Safari 9.1

🔗 https://developer.apple.com/library/prerelease/mac/releasenotes/General/WhatsNewInSafari/Articles/Safari_9_1.html#//apple_ref/doc/uid/TP40014305-CH10-SW1
阅读评论

Safari 9.1 中推出许多令人兴奋的新功能,例如对picture元素的支持、对 Web 检查器的增强、CSS 变量以及 iOS 的手势事件。不过,我最兴奋的是 OpenType 支持,它具有诸如font-feature-settings之类的属性及其变体,如font-variant-ligatures和font-variant-caps,所有这些都使我们能够更精细地控制排版。

您今天可以在 OSX 10.11.4 和 iOS 9.3 测试版中试用这些新功能。

CSS 中的瑞士风格

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

CSS 中的瑞士风格是Jon Yablonski的一个令人愉快的项目,它重现了国际印刷风格的海报,这是一种始于 20 世纪 40 年代的视觉设计运动。

在 CodePen 中打开示例以查看每个示例在幕后是如何工作的。

糕点盒项目结束

🔗 https://the-pastry-box-project.net/alex-duloz/2015-december-31
阅读评论

来自 255 位作者的 1461 天写作(如果$(".the-baker").length正确的话!)

双色调主题

🔗 http://simurai.com/projects/2016/01/01/duotone-themes/
阅读评论

simurai 为 Atom 提供了一些优雅的低调主题。这可能是让我尝试切换到 Atom 的小事。不过,我得想象人们会将其移植到其他应用程序中。

来自 24 Ways 2015 的一些精选

🔗 https://24ways.org/2015/
阅读评论

24 Ways 非常棒的一年!整个存档值得浏览,并收藏最感兴趣的文章。以下是一些我们的最爱

  • 在让我的模式经受考验中,Ethan Marcotte 写了他使用 flexbox 属性的经验以及他是如何使用渐进增强技术帮助重新设计The Toast以保持内容完整性的。他问道“如果有人不以我的方式浏览网页怎么办?”
  • 在提供客户支持中,Elizabeth Galle 告诉我们“你写道歉信,但你也有机会让每个人下次与你的公司或产品互动时获得更好的体验。”
  • 在今年我在产品设计中学到了什么中,Meagan Fisher 说“如果你想做好,并考虑到每个用户,产品设计比你一开始预期的要复杂得多。”
  • 在烹饪有效的技术写作中,Sally Jenkinson 的技巧之一是使用“小型、可重用的组件”进行写作,这样当你在写作时想到“Sally,我真得需要再次解释如何安装 Sass 和 Node.js 吗?”时,你就不必再解释了,你可以链接它,而不会使文章变得臃肿。
  • 在选项卡应该如何工作中,Remy Sharp 通过创建一个要求清单来做好工作并从那里开始(而不是做最基本的事情,从而导致糟糕的工作)来解决 UI 模式(选项卡)。

网站肥胖危机

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

Maciej Ceglowski 的最新演讲都是关于前端性能、广告泡沫以及网络上的监控。有趣的是,他认为这些独立的问题实际上是相互关联的问题,最终会损害 Web 的构建方式。

赞助商:圣诞节提前到来(在 Creative Market 享受顶级设计资源 20% 的折扣)

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

在你沉迷于节日糖果和丑陋毛衣派对之前,一定要看看 Creative Market 新的20% 折扣优惠——涵盖从出色的笔刷字体到详细纹理到令人惊叹的图形套件的所有内容。在新的一年里,为您的设计工具箱添加新的内容,并观察您的作品在 2016 年得到改进。这是一个独特的机会,可以获取由才华横溢的商店所有者创建的资产,以优化您的设计工作流程——并且它们都享受 20% 的折扣!

要兑换您的优惠,请访问他们的折扣页面。动作要快,此优惠将于 12 月 25 日到期。

TypeKit 开始使用原生字体加载 API

🔗 http://blog.typekit.com/2015/12/16/better-font-events-with-the-native-font-loading-api/
阅读评论

Typekit 已更新了WebFont Loader项目,使其支持新的CSS 字体加载 API

在引入原生 API 之前,我们通过在页面中插入测试元素来检测字体加载。定期轮询这些元素的宽度以查看字体是否已加载。此过程非常昂贵,因为每次检查元素时都会触发页面范围的样式重排。使用原生 API,我们可以完全绕过此过程,从而带来巨大的性能提升。

当浏览器主动改进和加速事物时,这总是很不错,尤其是在有明显需求时,然后看到主要供应商立即使用它。

网络字体内容在这里是一个相当常见的话题,请随时浏览周围。

Quick Hits

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

CSS-Tricks 由DigitalOcean提供支持。

关注 Web 开发最新动态

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

DigitalOcean
  • 关于 DO
  • Cloudways
  • 法律信息
  • 获取免费积分!
CSS-Tricks
  • 为我们写作!
  • 与我们合作广告
  • 联系我们
社交
  • RSS Feed
  • CodePen
  • Mastodon
  • X
返回顶部

© 2024 . All rights reserved.