# 耗费4小时整理了9个前端经典问题

* 抖音：<https://v.douyin.com/iJBwxmvy/>
* B站：<https://www.bilibili.com/video/BV1n14y1q7YF/>

> 1、margin-top的百分比是根据父元素宽度计算的【2021-09-03】 <https://v.douyin.com/iJMCbs7S/>
>
> 2、全屏情况下，相比100%、100vw更容易产生滚动条【2022-11-28】 <https://v.douyin.com/iJMGmXHY/>
>
> 3、粘性布局sticky不起作用，大概率只有2个原因
>
> &#x20;  3.1、某个父级存在overflow不等于visible的情况【2021-07-07】
>
> &#x20;        <https://v.douyin.com/iJr2DKs1/>
>
> &#x20;  3.2、其父元素也完全滚出屏幕了【2021-07-09】&#x20;
>
> &#x20;        <https://v.douyin.com/iJMxXQrq/>
>
> 4、console.log并不能打印一个对象的快照，而是输出一个引用到控制台【2022-05-07】      &#x20;
>
> &#x20;        <https://v.douyin.com/iJMVCa1D/>
>
> 5、默认的text-align（baseline）特别容易出现3类问题：
>
> ```
> 不对齐：
> https://v.douyin.com/iJMX1aG2/ 【2021-08-25】并列的div不对齐
> https://v.douyin.com/iJMGuYyk/ 【2022-12-11】小图标与文字不对齐
>
> 出现缝隙：
> https://v.douyin.com/iJM4hasQ/ 【2021-12-28】容易造成图片上下有缝隙 
>
> 多出滚动条：
> https://v.douyin.com/iJMbdCoe/ 【2022-06-08】容易引发父元素多出滚动条
> https://v.douyin.com/iJMsMJoo/ 【2022-09-22】一个全屏canvas默认情况下可能会使网页多出滚动条
> ```
>
> 6、js使用scrollHeight的时候，一定要考虑相比其内容的高度是否有富裕【2022-10-14】 <https://v.douyin.com/iJMsXnf2/>
>
> 7、如果元素的数量会变化，那么forEach遍历Array和Set的时候一定注意效果上的区别【2022-06-29】 <https://v.douyin.com/iJMpSDcw/>
>
> 8、使用fiexd定位时，Apple全系浏览器（Webkit内核）有一种情况没有遵循W3C标准【2023-01-10】 <https://v.douyin.com/iJMtgnBs/>
>
> 9、所有vue组件第一层容器样式的类名务必不要跟父组件的类名冲突【2022-09-30】 <https://v.douyin.com/iJrY6uSN/>

昨晚花了4个小时

把我所有的视频过了一遍

然后整理了

个我觉得前端比较经典和常见的问题

我把这9个问题分别用一句话概括

然后配上封面和发布日期

给大家分享一下

同时呢

也会把这些视频的入口放到1024bugs上面