牛客前端八股文

1.说说HTML语义化?

得分点:语义化标签、利于页面内容结构化、利于无CSS页面可读、利于SEO、利于代码可读

1,标签语义化是指在开发时尽可能使用有语义的标签,比如header,footer,h,p,少使用无语义如div。

2,标签语义化的好处有三点,首先对开发者来说,能够提高代码可读性,利于前期开发以及后期维护;对于用户来说,在样式表没有加载出来时,整个页面结构依旧清晰,给用户一个不错的体验感;对搜索引擎来说,利于爬虫读取有用的信息,提升网页排名。

3,目前语义化并没有得到广泛应用,如京东,淘宝官网依旧采用大量无语义标签。原因是语义化带来的好处不足以其耗费人力物力去重写网站。

2.说说盒模型?

得分点 标准盒模型、怪异盒模型、`box-sizing:border-box`、盒模型大小

1,CSS盒模型本质是一个盒子,包含 padding、border、margin、content。盒模型分为两类,W3C标准盒模型和IE怪异盒模型,一般我们的盒子默认是标准盒模型。

2,两者区别是标准盒模型的实际宽高会把padding和border计算在内,而怪异盒模型不会。

3,形成怪异盒模型的条件是box-sizing:border-box;形成标准盒模型的条件box-sizing:content-box。

3.说一下浮动?

得分点 脱离文档流、盒子塌陷、 影响其他元素排版、伪元素 、`overflow:hidden` 、标签插入法

  1. 浮动的作用:设置浮动的图片,可以实现文字环绕图片,设置了浮动的块级元素可以排列在同一行,设置了浮动的行内元素可以设置宽高,同时可以按照浮动设置的方向对齐排列盒子。

  2. 浮动特点: 脱离文档流,盒子塌陷,影响其他元素排版

  3. 解决塌陷:

(1)额外标签法(隔墙法):在最后一个浮动标签后添加一个标签,给其设置clear:both,如果清除了浮动父元素自动检测盒子最高的高度,然后与其同高。

(2)父元素添加overflow属性,overflow: hidden。

(3)父级添加after伪元素(推荐做法)。

(4)父级添加before和after双伪元素。

  1. 清除浮动的特点:

4. 样式优先级的规则是什么?

得分点 `!important`、行内样式、嵌入样式、外链样式、id选择器、类选择器、标签选择器、复合选择器、通配符、继承样式

1.!important、 2.行内样式>(嵌入样式、外链样式)、 3.id选择器(#id{}) >(类选择器(.class{})、伪类选择器( :hover{})、属性选择器(ahref="segmentfault.com"{}))>(后代选择器(.father .child{})、伪元素选择器( ::before{}))>(子选择器(.father > .child{})、相邻选择器( .bro1 + .bro2{}))>通配符选择器(*{})、 4.继承样式、 5.浏览器默认样式

5. 说一说CSS尺寸设置的单位?

得分点 px、rem、em、vw、vh

(1)css一共有五个长度单位,分别是px,em,rem,vw,vh

(2)除了px是绝对单位,其他都是相对单位。

(3)em相对于自身大小(但在font-size中相对于父元素字体大小)

(4)rem相对于根元素的字体大小

(5)vw相对于可视化窗口的宽(1vw就是1%可视化窗口宽度)

(6)vh相对于可视化窗口的高(1vh就是1%可视化窗口高度)

(7)一般采用rem+媒体查询或者rem+vw来实现响应式布局。原理是当窗口大小发生变化时,通过媒体查询或者vw改变根元素的字体大小,从而改变以rem为单位的元素大小

相关推荐
雪芽蓝域zzs几秒前
第四十九节:TagsView 右键菜单(带三角箭头)给每个 tag 增加**鼠标右键菜单**(右键标签弹出:关闭、关闭其他、关闭全部)
前端·javascript·vue.js
এ慕ོ冬℘゜14 分钟前
从零开发移动端医院挂号页面:适配、交互与前端实现详解
前端·javascript
智购科技自动售货机工厂40 分钟前
2026自动售货机端侧AI降本逻辑:从云端API到本地推理的成本重构~YH
人工智能·python·ui·面试·交互
掘金挖土1 小时前
前端手摸手跑路之 AI 应用开发(六)
前端·后端
liuyt20221 小时前
【javaweb】day4
前端
野生技术架构师1 小时前
1000+ Java面试题知识图谱:从基础语法到分布式架构的完整拓扑
java·面试
志尊宝1 小时前
Vue3 零基础每日笔记(024):组件的创建与使用——从 import 到自动导入
前端·vue.js·笔记·前端框架·html5
@PHARAOH1 小时前
WHAT - 从前端组件化思维到后端架构设计入门
前端·微服务·架构
流浪0012 小时前
Linux系统篇34——信号(六):信号处理期间又来了怎么办?——sigaction、sa_mask、可重入函数与 volatile
linux·运维·面试·操作系统·信号处理·信号
是立不是利2 小时前
大文件导致请求被拒的连锁反应
开发语言·前端·javascript