千锋教育-做有情怀、有良心、有品质的职业教育机构

手机站
千锋教育

千锋学习站 | 随时随地免费学

千锋教育

扫一扫进入千锋手机站

领取全套视频
千锋教育

关注千锋学习站小程序
随时随地免费学习课程

当前位置:首页  >  技术干货  > 2022常见前端基础面试题(含答案)六

2022常见前端基础面试题(含答案)六

来源:千锋教育
发布人:wjy
时间: 2022-08-11 16:21:43 1660206103

  谈谈flex布局,你知道flex:110吗

  - flex布局:弹性盒布局(形成弹性盒后可以控制子元素在父级元素中排列位置)

  - flex:1 1 0 是由 flex-grow:1 flex-shrink:1 flex-basis:0复合而成 也可以简写为flex:1

  表示占据主轴上剩下的空间 当子级内容超出的时候会将当前区域撑大

  - flex-grow默认值为0,当值大于0时,当父元素有剩余空间时当前元素放大,父元素没有剩余空间时,该元素不放大。

  - flex-shrnk默认值为1,父元素有剩余空间时,该元素不缩小,父元素没有剩余空间时,该元素缩小。

  - **flex-basis**相当于width属性。

 

2022常见前端基础面试题

  谈一下怎么实现一个椭圆,使用css

  · 使用border-radius属性 属性值可以设置一个/两个/三个/四个/八个 以下是两种方法实现椭圆

  o 第一种: width: 250px; height: 150px;background: #FFD900;border-radius: 50%

  o 第二种: width: 250px; height: 150px;background: #FFD900;border-radius: 50% / 100% 100% 0 0;

 

  脱离布局流有几种方法?

  - 常见的有浮动和定位

  - 第一种:浮动布局(float)浮动一般用于让块级元素排成一行在同一行显示任何元素都可浮动,如一个元素设置为浮动元素,浮动元素无论最初是什么都会变成一个行块级元素,拥有disolay:inline-block属性

  - 第二种:定位布局(position) 定位中的absolute绝对定位可以让元素脱离文档流的 如果父级有定位属性就相对于父级定位 如果父级没有就会一直往上级查找直至浏览器

  - 脱离文档流布局的缺点初始位置不存在就会破坏网页布局

 

  伪类伪元素区别

  · 相同点:都是属于选择器中的一种,能实现对于页面元素的修饰

  · 不同点:

  o 1、概念不同:伪类:用于已有元素处于某种状态时为其添加对应的样式,这个状态是根据用户行为而动态变化的;例如鼠标的悬停效果;伪元素:用于创建一些不在DOM树中的元素,并为其添加样式;例如:先前向后插入元素内容等等

  o 2、使用方法不同:css3规范中要求使用双冒号(::)表示伪元素,以此来区分伪类和伪元素,比如::before和::after等伪元素使用双冒号(::),:hover和:active伪类使用单冒号(:)目前来看有一部分浏览器为了达到一个更好的兼容性的问题,我们的双冒号也可以写成单冒号;但是在一些低版本浏览器里面有些时候还是需要使用双冒号的

 

  为什么无法定义1px左右高度的容器

  高版本浏览器里面是能够定义1px的高度的容器的 但是由于浏览器的版本和浏览器的内核不一样导致低版本浏览器中的兼容性不一样 在低版本 IE6浏览器下面,容易出现这个问题,产生问题的原因是因为默认的行高造成的, 解决的方法也有很多,例如:overflow:hidden | zoom:0.08 | line-height:1px

  更多关于html5培训的问题,欢迎咨询千锋教育在线名师,如果想要了解我们的师资、课程、项目实操的话可以点击咨询课程顾问,获取试听资格来试听我们的课程,在线零距离接触千锋教育大咖名师,让你轻松从入门到精通。

tags:
声明:本站稿件版权均属千锋教育所有,未经许可不得擅自转载。
10年以上业内强师集结,手把手带你蜕变精英
请您保持通讯畅通,专属学习老师24小时内将与您1V1沟通
免费领取
今日已有369人领取成功
刘同学 138****2860 刚刚成功领取
王同学 131****2015 刚刚成功领取
张同学 133****4652 刚刚成功领取
李同学 135****8607 刚刚成功领取
杨同学 132****5667 刚刚成功领取
岳同学 134****6652 刚刚成功领取
梁同学 157****2950 刚刚成功领取
刘同学 189****1015 刚刚成功领取
张同学 155****4678 刚刚成功领取
邹同学 139****2907 刚刚成功领取
董同学 138****2867 刚刚成功领取
周同学 136****3602 刚刚成功领取
相关推荐HOT