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

Links

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

相对于另一个元素定位元素

🔗 http://discourse.wicg.io/t/position-an-element-relatively-to-another-element-from-anywhere-in-the-dom/968
阅读评论

目前在 CSS 中不可行,但正在讨论类似以下的语法

.el {
  position: element(#target)
}

当然,有很多细节、陷阱和边缘情况,但听起来很有可能。

滚动到顶部然后固定

🔗 http://demosthenes.info/blog/1052/position-sticky-scroll-to-top-then-fixed-in-pure-CSS
阅读评论

Chrome 取消了position: sticky;,但 Firefox 和 Safari 仍然保留了它。Dudley Storey 展示了如何实现常见的侧边栏模式,其中一段内容在您向下滚动时跟随您,但仅在有空间时才显示。他使用 CSS 完成了此操作,并且演示使用stickyfill补充了支持。

使用 CSS will-change 属性修复滚动性能

🔗 https://fourword.fourkitchens.com/article/fix-scrolling-performance-css-will-change-property
阅读评论

Chris Ruppel 使用will-change修复了一个真实的滚动问题。

我以为我们应该仅通过 JavaScript 应用/删除 will-change 吗?或者滚动是否不同,因为始终存在滚动的可能性并且没有本机的 scrollEnd 事件?

现代 CSS 布局,力量与责任

🔗 https://www.rachelandrew.co.uk/archives/2015/07/28/modern-css-layout-power-and-responsibility/
阅读评论

Rachel Andrew 提醒我们,新的 CSS 布局方法赋予我们的力量可能会被用来形成新的反模式。

能力越大,责任越大。正如开发人员可以从一个结构良好、语义化的文档开始,并使用 Grid 和 Flexbox 来满足设计需求一样,他们也可能完全不再关心文档结构。更糟糕的是,我相信,尤其是在 Grid 中,会有一种强烈的诱惑,将文档结构扁平化,以便所有元素都成为声明了 Grid 的元素的子元素。使布局变得简单,但代价是什么?

展望未来:CSS 滚动捕捉点

🔗 http://blog.teamtreehouse.com/css-scroll-snap-points
阅读评论

Guil Hernandez 介绍了使用非常简单的 HTML 和 CSS 的全新scroll-snap-*属性,滑块(具有良好的用户体验)将多么容易实现。CSS 最近发展得相当快,像这样的特性从“从未听说过”变成了

…CSS 滚动捕捉点的浏览器支持仅限于 IE10+ 和 Firefox 39+。但看起来 Safari 9 将包含支持,您可以在 Chrome Canary 中启用滚动捕捉点。

在你意识到之前。Chrome 的支持意味着它将逐渐普及到 Opera 和 Android,Safari 的支持意味着它将逐渐普及到 iOS,因此很快将在整个平台上获得非常稳定的支持。

赞助商:FullStory

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

从用户的角度查看您的网站。

FullStory 精确记录每个客户会话在浏览器中的呈现方式——解锁像素级回放、DOM 和控制台检查、任何页面元素或交互的可搜索性等等。

观察和了解真实用户如何与您的网站交互。超越分析,了解客户为什么没有采取预期操作,或者准确地排除问题会话,而无需在事后重新创建错误。查看获得完整故事的感觉,免费试用 14 天。

赞助商:An Event Apart

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

脱颖而出。在今天提高您的技能,并了解您在一两年内将如何完成工作。An Event Apart——为网站制作人员准备的三天设计、代码和内容盛宴——是响应式设计和移动优先等理念诞生的场所,也是今年的与会者已经学习网格布局、CSS 形状和其他高级技术将如何从根本上改变……好吧,一切。不要错过!

在即将到来的芝加哥展会上,Dave Rupert 和我将在舞台上进行现场 ShopTalk Show!我们正在收集问题,专门用于此活动。

12 个鲜为人知的 CSS 事实(续集)

🔗 http://www.sitepoint.com/12-little-known-css-facts-the-sequel/
阅读评论

嘿。我听说你喜欢 CSS 技巧。你可能也会喜欢 Louis Lazaris 的这些 CSS 事实。

而且我敢打赌,你也会喜欢 Lea Verou 的新书CSS Secrets。

jQuery 3.0(alpha)

🔗 https://blog.jqueryjs.cn/2015/07/13/jquery-3-0-and-jquery-compat-3-0-alpha-versions-released/
阅读评论

此版本中有很多很棒的东西,例如动画利用了requestAnimationFrame。

不过,您应该在升级之前进行认真的测试。不仅因为这是 alpha 版本,还因为.show()和.hide()现在的工作方式大不相同。它们不会做任何花哨的事情来与 CSS 配合使用或将元素恢复到隐藏之前的显示类型。这些是使用非常广泛的方法。很有可能您的代码库中有一些。

最佳实践已成为:根本不要使用这些方法,只切换处理元素可见性的类。

CodeNewbie

🔗 http://www.codenewbie.org/podcast/css-tricks
阅读评论

我加入了 Saron Yitbarek 的播客,我们进行了精彩的对话,讨论了我的一些历史和正在进行的项目。

Quick Hits

# 2024 年 8 月 23 日
# 2024 年 8 月 21 日
# 2024 年 8 月 14 日
# 2024 年 8 月 14 日
更多快速提示 →
  • 更新
  • 1
  • ...
  • 139
  • 140
  • 141
  • ...
  • 219
  • 较旧

CSS-Tricks 由DigitalOcean提供支持。

关注 Web 开发最新动态

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

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

© 2024 . All rights reserved.