![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTMLCSS
文章平均质量分 93
Asen-coder
web前端工程师
展开
-
一文彻底搞懂flex布局
# `CSS3`新增布局之一:`flex`布局## flex背景flex 布局背后的**主要思想**是让容器能够改变其项目的宽度/高度(和顺序)以最好地填充可用空间(主要是为了适应各种显示设备和屏幕尺寸)。弹性容器扩展项目以填充可用的可用空间或缩小它们以防止溢出。最重要的是,与常规布局(基于垂直的块和基于水平的内联)相反,**弹性盒布局与方向无关**。虽然这些适用于页面,但它们缺乏灵活性来支持大型或复杂的应用程序(尤其是在涉及方向更改、调整大小、拉伸、收缩等时)。**注意:** `flexbo原创 2022-05-28 13:53:05 · 1302 阅读 · 0 评论 -
一文解决零基础 Sass入门
一文解决零基础 Sass入门,从初次使用sass到熟练掌握sass(mixin混入与媒体查询@media)原创 2022-05-24 15:45:35 · 893 阅读 · 0 评论 -
详解原生JS实现走马灯轮播图
通栏轮播图重点:这里,尽量选择图片尺寸相同的图片,本文,我用4张不同尺寸的图片作demo演示给读者!(尽量使用相同规模的图片)将图片设置为相同规模后,左浮动依次排开,设置css样式,此部分省略,代码如图此部分过于简单,不展示由于轮播图移动时,最后一张图片点击右按钮后需要及时切换为第一张,所以这里,我们需要一个假的第一张图片,放置在最后,使最后一张图片为第一张图片的假图!在JS文件中,克隆第一张图片,并将其使用appendChild方法追加到最后!我们在js文件夹中创建carousel.js文件,并在h原创 2022-05-08 15:25:25 · 3163 阅读 · 2 评论