subgrid这个子网格特性当时Grid布局出来之后,呼声很高,现在终于支持了,非常适合那种比较规整的多层次嵌套的布局,赶快来了解一番吧。
阅读全文…
标签:display:grid, flex布局, gap, grid布局, minmax(), repeat, subgrid 发布在 CSS相关 | 6 条评论 »
好消息,height:auto、width:fit-content这些以前无法触发transition过渡效果的CSS声明,现在也能动画啦,就是使用calc-size()函数或interpolate-size属性。
标签:calc, calc-size(), CSS动画, fit-content, interpolate-size, max-content, min-content, transition, 动画 发布在 CSS相关 | 5 条评论 »
CSS @property规则最具代表性的作用是扩大了CSS动画和CSS过渡效果的应用范围,还是挺实用的一个Houdini特性。
标签:@keyframes, @property, CSS渐变, houdini, 动画, 过渡 发布在 CSS相关 | 2 条评论 »
最近Chrome进行了第4批CSS数学函数的支持,包括mod()/rem()/round(),其中round()函数尤为的实用。
标签:abs(), animation, cos(), CSS数学函数, font-size, mod(), progress, rem, round(), sign(), sin(), steps 发布在 CSS相关 | 一条评论 »
之前使用align-content控制元素的垂直对齐仅适用于Flex或Grid元素,而现在,Block元素也能使用啦!
标签:align-content, justify-content, place-content, vertical-align, 对齐 发布在 CSS相关 | 4 条评论 »
CSS滚动动画比我预想的要强多了,项目中又有很多JavaScript代码可以淘汰了。
标签:animation, animation-range, animation-timeline, CSS动画, overscroll-behavior, scroll-timeline, timeline-scope, view-timeline, 动画, 滚动 发布在 CSS相关 | 9 条评论 »
View Transitions API可以让页面元素在无需设置具体定位属性值的情况下实现各种各样的动画效果,是个很强很有用的新特性。
标签:animation, API, CSS动画, pagereveal, pageswap, transition, View Transitions API, 动画, 动画效果 发布在 CSS相关, Web综合 | 5 条评论 »
随着Firefox 131也支持了CSS Custom Highlight API,至此,所有现代浏览器下都可以实现无标签的文本内容高亮效果了。
标签:::highlight(), ::marker, API, createRange, HighlightRegistry, range, text-decoration, text-fill-color, 高亮代码 发布在 CSS相关, JS API | 11 条评论 »
CSS calc()计算函数又新增了infinity,NaN,pi等关键字,都来了解下是干嘛用的吧。
标签:@property, animation, border-radius, calc, hwb(), infinite, z-index, 关键字 发布在 CSS相关 | 6 条评论 »
列举了我目前所知的N多种纯CSS判断是不是Safari和iOS Safari浏览器的方法,希望可以对你的工作有所帮助。
标签:::marker, @supports, cross-fade, image-rendering, Safari, selector, text-size-adjust, user-select 发布在 CSS相关 | 一条评论 »
张鑫旭more,09年华中科技大学毕业,现上海,就职于阅文集团,专注web前端偏前领域,著有《CSS世界》《CSS选择器世界》《CSS新世界》《HTML并不简单》
邮箱:zhangxinxu@zhangxinxu.com
关注我:微信微博掘金知乎抖音热更B站Gitee