![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML5+CSS3
文章平均质量分 73
咸虾米_
这个作者很懒,什么都没留下…
展开
-
css渐变背景,linear-gradient()线性渐变和radial-gradient()径向渐变
我是爱搞知识的咸虾米。许多APP、小程序、网站等都喜欢采用渐变色背景,这样做不但可以增加设计感,而且能提升品牌辨识度。所以,今天使用css的线性渐变和径向渐变,给大家将这几种不同类型的渐变背景写出来。首先给大家分别展示几款常见的渐变色背景,然后我们依次完成编写。原创 2023-11-13 23:37:17 · 1054 阅读 · 2 评论 -
自定义元素宽高比例(aspect-ratio)与@supports兼容支持和图片裁剪(object-fit)的用法
使用grid布局可以轻松实现响应式布局,子元素只需要设置最小宽度即可,如果对子元素没有设置高度,那么高度取决于内容的最大值,这样显然是不稳定的,如下图所示:出现这种问题就造成布局混乱了,可能你最先想到的解决办法就是为子元素设置固定高度,这样显然是没有问题的,但是设置了固定高度之后,宽度可能是响应式的,高度固定了之后可能就会出现不协调的问题,如果想要达到这个目标,可以使用aspect-ratio宽高比例属性完成。原创 2023-10-31 23:14:45 · 2023 阅读 · 0 评论 -
grid网格布局,比flex方便太多了,介绍几种常用的grid布局属性
如果使用justify-content: space-between;注意:这三个属性是给父容器添加的,子元素,可以不用设置宽度,也不用设置margin间距即可完成如下布局。如何想让最后一行左对齐是有办法的,大家可以自行去搜索办法,能实现但是操作起来有些麻烦,但是。原创 2023-10-16 23:24:49 · 6102 阅读 · 9 评论