A guide to media queries, and a look at new CSS pseudo-classes on the way.

栏目: IT技术 · 发布时间: 4年前

内容简介:Current browser support for 'is()' viacaniuse.com:information_source:
A guide to media queries, and a look at new CSS pseudo-classes on the way.

Current browser support for 'is()' viacaniuse.com

CSS :is() and :where() Are Coming to Browsers — Šime Vidas explains how these new CSS pseudo-classes can be used ( for reducing repetition, and keeping specificity low respectively ).

Web Platform News

The Complete Guide to CSS Media Queries — A solid, thorough guide on all things CSS media queries, good as a primer, or worth revisiting for a refresher.

Polypane

A guide to media queries, and a look at new CSS pseudo-classes on the way.

JAMstacked: An Email Update on The Evolving JAMstack Ecosystem — Join Brian Rinaldi for a regular email update on all things JAMstack, including all of the latest resources developers need to know about.

Cooperpress sponsor

Animate.css v4: Just-add-water CSS Animations — This is one of the most popular of the ‘drop-in’ CSS animation libraries, and they’ve now moved to version 4. Significantly, amongthe changes is a prefix on classes.

daniel eden

Cool Little CSS Grid Tricks for Your Blog — An exploration of how you can use CSS Grid, along with properties such as auto-fit and auto-fill , to produce some nifty looking image galleries.

Ana Tudor

Publishers Sue Internet Archive For 'Mass Copyright Infringement' — Whilst the legal action here is specifically to do with ebooks, it’s important to underline the excellent preservation work of the Internet Archive ( which includes the Wayback Machine ) and how hugely important it is to the long-term conservation of the web as a whole.

Colin Dwyer (NPR)

:zap:️ Quick bits:

:computer: Jobs

Frontend Developer at X-Team (Remote) — Join X-Team and work on projects for companies like Riot Games, FOX, Coinbase, and more. Work from anywhere.

X-Team

Find A Job Through Vettery — Vettery specializes in tech roles and is completely free for job seekers. Create a profile to get started

Vettery

:information_source: Interested in running a job listing in Frontend Focus? There'smore info here.

:orange_book: Tutorials & Opinion

The Service Worker Lifecycle Explained — Explaining the lifecycle of Service Workers in PWAs and how to update them as fast as possible.

Felix Gerschau About

Grid for Layout, Flexbox for Components — Ahmad looks at the key differences between these two layout options, and although there’s no right or wrong here, he recommends some use-cases for where you may want to use each.

Ahmad Shadeed

The Mad Magazine Fold-In Effect in CSS — An impressive CSS-only recreation of the Mad magazine fold-ins (where folding a printed page would reveal a hidden message in the artwork).

Thomas Park

Quick Tips for High Contrast Mode — A few simple pointers to improve the High Contrast Mode experience for Windows users.

Sarah Higley

Scale Your Software Projects Without Losing Speed — See how Shopify used Buildkite CI/CD to scale from 300 to 1800 engineers while keeping build times under 5 minutes.

Buildkite sponsor

How to Create a Motion Hover Effect for a Background Image Grid — You’ll need to seethe demo to get it, but it’s a neat visual effect well suited for when you’ve got a variety of photos to illustrate a concept.

Mary Lou

Styling Numbered Lists with CSS Counters — How to use CSS counters to customize the appearance of numbers in an ordered list.

Supun Kavinda

CSS Viewport Units: A Quick Start — Covers vh , vw , vmin and vmax .

Asha Laxmi and Maria Antonietta Perna

:wrench: Code, Tools and Resources

A guide to media queries, and a look at new CSS pseudo-classes on the way.

CSS Grid: Newspaper Layout — This is an excellent demo showing how Grid can be used to create a responsive newspaper-style layout.

Olivia Ng codepen

FAB: Frontend Application Bundles — A bundle format for frontend applications that unify static sites, SPAs, server-side rendering (SSR), and server-side logic in a single format that’s easy to deploy.

Frontend Application Bundles

Grid.js: An Advanced Table Control — A lightweight, advanced table plugin that can work alongside React, Angular, Vue, or, well, nothing. Check out some ofthe examples for more on how to use it. It uses Preact under the hood.

Afshin Mehrabani

Quotebacks: Embed Quotes Without Losing Context — This is a small library that can embed a quote in an attractive format within the source context. Can also be used as a Chrome extension that saves to local storage.

Tom Critchlow and Toby Shorin

Sorted CSS Colors: A Way to Navigate CSS Colors By Hue — This feels like quite a natural way to navigate the over 100 ‘named’ CSS colors (like Gainsboro , Firebrick , and LawnGreen ).

Mustafa Enes

SweetAlert: Attractive Modal Popup Alerts/Messages — Bills itself as ‘a beautiful replacement for JavaScript’s “ alert ”’

Tristan Edwards et al.

μJam: A Minimalistic Jamstack Approach for Creating GitHub-Pages Hosted Sites — Use Visual Studio Code as a lightweight authoring and publishing tool for small to medium websites.

Stefan Goessner


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

高性能MySQL

高性能MySQL

施瓦茨 (Baron Schwartz)、扎伊采夫 (Peter Zaitsev)、特卡琴科 (Vadim Tkachenko) / 宁海元、周振兴、彭立勋、翟卫祥,刘辉 / 电子工业出版社 / 2013-5-1 / 128.00元

《高性能mysql(第3版)》是mysql 领域的经典之作,拥有广泛的影响力。第3 版更新了大量的内容,不但涵盖了最新mysql 5.5版本的新特性,也讲述了关于固态盘、高可扩展性设计和云计算环境下的数据库相关的新内容,原有的基准测试和性能优化部分也做了大量的扩展和补充。全书共分为16 章和6 个附录,内容涵盖mysql 架构和历史,基准测试和性能剖析,数据库软硬件性能优化,复制、备份和恢复,高可......一起来看看 《高性能MySQL》 这本书的介绍吧!

JS 压缩/解压工具
JS 压缩/解压工具

在线压缩/解压 JS 代码

CSS 压缩/解压工具
CSS 压缩/解压工具

在线压缩/解压 CSS 代码

html转js在线工具
html转js在线工具

html转js在线工具