新浪前端面试题及详细答案.docxVIP

新浪前端面试题及详细答案

一、基础必考题（新浪高频，侧重实操落地）

1.请说说HTML5的语义化标签有哪些，实际开发中你怎么用？（新浪常问，结合页面场景）

答案：首先说常用的语义化标签，不是死记，而是结合新浪这类资讯类网站的场景来说——比如header（页面头部，放logo、导航）、nav（导航栏，比如新浪新闻的顶部导航）、section（内容区块，比如一篇新闻的正文容器）、article（独立文章，比如单篇新闻、博客）、aside（侧边栏，放热门推荐、广告）、footer（页脚，版权、联系方式）。

实际开发里，新浪的页面大多是资讯、内容类，用这些标签第一是提升可读性，比如后端或者其他同事看代码，能快速分清哪个是导航、哪个是正文；第二是SEO友好，新浪作为资讯平台，语义化标签能让搜索引擎更好抓取内容，比如article标签里的内容会被判定为核心内容；第三是避免全用div嵌套，减少代码冗余。

注意点：不是所有区块都用语义化，比如一些装饰性的小容器，用div就够了，没必要硬套section，语义化的核心是“见名知义”，贴合内容场景。

2.CSS中flex布局，怎么实现子元素水平居中、垂直居中？实际开发中遇到过哪些坑？

答案：最常用、最简洁的写法，给父容器设置display:flex;然后加上justify-content:center;（水平居中）、align-items: