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

Links

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

赞助商:Brackets 的 Extract

🔗 http://synd.co/10RRo3J
阅读评论

自动完成是代码编辑器的一个非常棒的功能,对吧?它可以帮助我们更快、更准确地输入,并建议我们可能不会立即想到的内容。(是white-space: prewrap;还是whitespace: pre-wrap;?)

Extract,代码编辑器Brackets的一个新的 Creative Cloud 功能,使自动完成功能更加强大。想象一下,如果您在 Photoshop 中选择了特定的图层,您正在编写一些 CSS,并且颜色自动完成建议了该图层的填充颜色。或者它填充的渐变语法。或者它距离文档顶部的距离。Extract 实现了所有这些以及更多。

使用 Extract,它为您提供所有这些以及更多功能。当您输入background-image时,它会将当前图层导出为图像并将其放置在该文件路径的任何位置。在 HTML 中,文本可以自动完成文本图层中的文本。或者将图层提取为<img>的src。

这是一种推动代码编辑体验向前发展的新型创新。

特异性图表

🔗 http://csswizardry.com/2014/10/the-specificity-graph/
阅读评论

Harry Roberts,关于绘制整个代码库中 CSS 选择器特异性的图表

一个多刺的图表是一个糟糕的图表。

我认为,如果您完全采用一种鼓励对所有内容使用类名的使用方法,您的图表将几乎是平坦的。我想知道这是否是一个值得追求的目标。一些可以划清界限的东西,为了项目的利益。

赞助商:Wufoo

🔗 http://ad.doubleclick.net/ddm/clk/270735259;104033101;o?http://www.wufoo.com/landing/1/?utm_source=csstricks&utm_medium=ppc&cmpid=brand&utm_network=d&utm_term=sponsored_post
阅读评论

我只是发布这个作为对 Wufoo 长期赞助 CSS-Tricks 的一个大大的击掌。

Wufoo 是一款用于构建 Web 表单的 Web 应用程序。例如联系表单、会议注册表单、T 恤销售表单、婚礼 RSVP 等,应有尽有。您可以将表单放在您自己的网站上(如果您愿意)。它们在小屏幕上工作。它们不会收到垃圾邮件。它们永远保存其数据。它们可以是多页的并使用逻辑。表单需要做的所有事情。

正如你们许多人所知,我过去是 Wufoo 的早期员工之一。我仍然对我们在 Wufoo 做的工作感到非常自豪,我对今天的 Wufoo 感到满意。我每天都大量使用 Wufoo。每一天,它都为我参与的所有网站上的几乎所有表单提供支持,以及许多我很久以前构建的并且仍然运行良好的表单。它是一款可靠的、功能丰富的软件,可以非常出色地完成它的工作。

赞助商:Hack Reactor 的沉浸式远程 Beta 课程

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

Hack Reactor 的编码学校正在接受其下一门在线沉浸式课程 Remote Beta 的申请。他们由经验丰富的讲师和工作人员组成的团队致力于双重使命,即通过快速迭代教学赋予人们权力并改变教育。学生培养他们所需的技术和信心,毕业后成为中高级工程师,并在后端和前端任务中为顶级科技公司工作。

立即申请即将到来的现场或在线课程,并在 12 周的沉浸式学习中成为一名工程师。

我的两个轶事

  1. 我刚刚观看了纪录片《象牙塔》,它对大学现状进行了非常有趣的观察。有一点可以肯定:教育正在发生变化。
  2. 我现在有两个朋友通过编码学校改变了他们的职业生涯。

被切除额叶的猫头鹰

🔗 http://alistapart.com/article/axiomatic-css-and-lobotomized-owls
阅读评论

我最近在 CSS-Tricks 的草稿中有一篇帖子,名为“从模块底部删除空格”。它都是关于那种棘手的情况,您希望元素周围有均匀的填充以视觉上分隔它们。但内部的元素也需要底部边距,这可能会导致底部出现额外的空间,因为该边距与填充相交。

显然我年纪大了,而且神志不清,因为我已经写过这方面的内容了。但是我在那篇文章中并没有得出任何惊人的结论。我想到的最好的方法是一个有点粗俗的复合选择器,我甚至不想谈论它。

Heydon Pickering 对此问题确实有一个惊人的结论

* + * {
  margin-top: 1.5em;
}

我肯定会在一个新的项目中尝试这个。但它确实让我认为未来的 CSS 可以帮助我们解决这个问题。也许指定允许填充的特定边缘折叠到边距中?

赞助商:Creative Market – 十月大型合集

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

随时拥有一个您知道可以随时随地使用的个人设计资源库,这总是很棒的。矢量装饰和插图、照片、纹理、图案、字体、布局,所有这些好东西。

没有比 Creative Market 更好的补货场所了。本周,他们整理了一份其最佳产品的“大型合集”。从图形和字体到照片和 Photoshop 动作。只需 39 美元,您就可以用105 种资源来填充您的设计师工具包。这仅在 10 月 21 日之前可用,因此请务必在太晚之前获取它。

赞助商:Stack – 开发团队的任务管理

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

Stack 是一个功能强大的新型任务管理系统,适用于开发人员和设计师。一个简单且完全可定制的工具,适合您的工作流程。轻松无忧地实时管理项目并与您的团队沟通。

我真的很喜欢 Stack 的方法。这正是我想要的方式。有一些项目——任务放入的大桶。然后每个项目都有这些列,您可以根据需要组织它们。每个任务实际上都位于一列中。可能是不同类型的任务或任务的状态,任何有效的方法都可以。然后每个任务都有自己关于人员、对话、待办事项等的小世界,如果需要的话。因此,我可能有一个 CSS-Tricks 帐户,其中有一个名为“The Lodge”的项目,其中有一列名为“要拍摄的视频”,每个视频都是一个任务,在该任务中,我记下计划的内容。漂亮。

免费试用 30 天,无需信用卡即可开始使用。此后采用超简单的定价模式(每月每用户 5 美元)。

不要使用`picture`(大多数时候)

🔗 http://blog.cloudfour.com/dont-use-picture-most-of-the-time/
阅读评论

Jason Grigsby

除非您要解决艺术指导问题,否则您不需要元素。事实上,您可能通过使用<picture>元素而损害了用户体验。

我敢打赌,大多数“响应式图像”的使用都是为情况提供适当大小的图像。情况=图像将显示的大小、屏幕像素密度和带宽。这正是<img sizes="" srcset="">最擅长的。它执行浏览器可以优化的神奇操作,而<picture>的效率仅与其为其显式设置的规则一样高(在这些规则中,您几乎肯定没有足够的详细描述来最大化效率)。仅当您需要执行非常明确的操作(例如,您需要交换完全不同的图像的确切断点)时,才使用实际的图片元素。

贝塞尔曲线游戏

🔗 http://bezier.method.ac/
阅读评论

帮助您掌握钢笔工具的游戏。

作者:Mark MacKay。

在我职业生涯的早期,我有一份工作,其中很大一部分是在照片上剪切详细的剪切路径(使用 Photoshop 中的钢笔工具)。我们有一个内部摄影部门,负责拍摄家具和电子产品等,我必须在所有东西周围剪切轮廓,以便设计师可以根据需要轻松地隔离事物。我相信我处理过数千张照片。我仍然不是超级专家,但我重视我的钢笔工具技能,并最终定期使用它们。

CSS Shapes 入门

🔗 http://www.html5rocks.com/en/tutorials/shapes/getting-started/
阅读评论

我刚刚观看了 Jen Simmons 做的演讲现代布局:走出我们的老路,她提供了一些关于 CSS Shapes 使用起来多么简单的极佳示例,即使是安全的渐进增强也是如此。如果您从未听说过它们,从本质上讲,它是一种将内容(通常是文本)包裹在自定义类似 SVG 的路径中的方法。

机缘巧合的是,Razvan Caliman 发布了一篇关于其工作原理以及如何使用真实示例进行使用的超长帖子。

Quick Hits

# 2024 年 8 月 23 日
# 2024 年 8 月 21 日
# 2024 年 8 月 14 日
# 2024 年 8 月 14 日
更多快速提示 →
  • 更新
  • 1
  • ...
  • 149
  • 150
  • 151
  • ...
  • 219
  • 较旧

CSS-Tricks 由DigitalOcean提供支持。

随时了解 Web 开发动态

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

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

© 2024 . All rights reserved.