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

手机站
千锋教育

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

千锋教育

扫一扫进入千锋手机站

领取全套视频
千锋教育

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

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

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

来源:千锋教育
发布人:wjy
时间: 2022-08-11 16:25:35 1660206335

  现在想调节—下父元素的透明度,但是又不影响子元素的透明度,怎么破?

  - 原因分析:

  - 使用css的opcity属性改变某个元素的透明度,但是其元素下的子元素的透明度也会被改变,即便重定义也没有用,不过有个方法可以实现,大家可以看看。

  可以使用一张透明的图片做背景可以达成效果,但是有没有更简单的方法呢?使用 RGBA。

  - 例如:

  - 设置父元素opacity:0.5,子元素不设置opacity,子元素会受到父元素opacity的影响,也会有0.5的透明度。

  即使设置子元素opacity:1,子元素的opacity:1也是在父元素的opacity:0.5的基础上设置的,因此子元素的opacity还是0.5。

  - 解决方法:

  - 为父元素设置background: rgba(0,0,0,0.5)。

 

2022常见前端基础面试题

  有没有了解过box-sizing,除了border-box还用过哪些,有没有用过其他的box-sizing的属性值属性

  box-sizing从本质角度触发,他控制盒子大小的尺寸,在这里里面他有两个取值经常被使用

  - 1、box-sizing:content-box;content-box可以理解成计算盒子大小的时候从内容区域开始进行计算,也就是计算的时候按照标准盒子模型进行计算;遵循W3C官方盒子模型的计算方法

  如果是不携带box-sizing这个属性的话,盒子模型的大小计算仍然按照标准盒子模型进行计算因为content-box是box-sizing属性的默认值

  - 2、box-sizing:border-box;border-box可以理解成计算盒子大小的时候从边框区域进行计算,也就是按照怪异盒子模型的标准进行计算,遵循的是ie怪异盒子的标准,通过box-sizing:border-box能够改变盒子模型的计算方法

 

  语义化的理解?有哪些语义化标签,有什么作用!

  语义化:顾名思义,见名知意,通过明智知道意思;

  在HTML5里面为了方便我们的开发,W3C为我们提供了大量的语义化标签,

  通过这些语义化标签能够清楚的了解区块的功能,也能让页面的结构更加的简化避免起类名和id名字

  HTML5新增的语义化标签有

  header——标记头部区域的内容(用于整个页面或页面中的一块区域)

  footer——标记脚部区域的内容(用于整个页面或页面中的一块区域)

  section——Web页面中的一块区域

  article——独立的文章内容

  aside——相关内容或者引文

  nav——导航类辅助内容

  main----主要内容区域

  figure----独立的文档流区域

  figcaption---独立文档流区域标题

  time------时间标签

  mark-----着重标记,默认高亮背景变黄

  audio-----音频

  video-----视频

  canvas----绘图

  datalist---模拟虚拟搜索列表

 

  #怎么实现三角形

```HTML

<div></div>

<style>

    div{

        /*为啥使用行内块元素,因为这样能与前面文本横向排列,避免浮动*/

        display:inline-block;

        width:0px;

        height:0px;

        border:10px solid transparent;

        border-top:10px solid red

    }

</style>

```

  更多关于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