首页 前端知识 html&css面试题总结

html&css面试题总结

2024-08-14 00:08:54 前端知识 前端哥 21 975 我要收藏

网络中使用最多的图片格式有哪些

  • jpg, png, svg,webp,bmp;

请简述css盒子模型

  • 盒子模型是指html的每个元素都像一个盒子,可以设置宽高,主要由content box,padding box,border, 和margin组成

视频/音频标签的使用

  • 音视频标签是h5新增的标签,主要用来给页面引入音频和视频,支持的音频和视频格式根据浏览器不同支持性也不同,一般音频支持最好的是 mp3, 视频支持最好的是mp4,音频标签的属性有 autoplay,control,loop,muted;视频标签的属性有autoplay,control,loop,muted

HTML5新增的内容有哪些?

  • 语义化标签

Html5新增的语义化标签有哪些?

  • header footer main section aside audio video nav

css3新增的特性

  • 伪类元素 弹性布局

清除浮动的方式有哪些?请说出各自的优点?

  • 给父元素使用overflow来清除浮动,
  • 给父元素设置高度
  • 添加伪类元素,使用clear方法

定位的属性值有何区别

定位的属性值主要有以下几种:

  • absolute :绝对定位,会脱离文档流,以有相对定位的父级元素为参照物移动
  • relative:相对定位,不会脱离文档流,以整个页面为参照物移动
  • fixed:固定定位,会脱离文档流,以整个页面为参照物
  • sticky:粘性定位,会脱离文档流,以整个页面为参照,会设置一个top值,当达到这个top值的时候就会类似固定定位

html水平垂直居中的方式有哪些?

如果是文本元素可以使用text-align:center,与line-height设置为与行内高度一致进行居中显示;
如果是块级元素可以使用margin:水平使用50%-元素自身的一半宽度,高度设置auto

border-box与content-box的区别

border-box的宽高是不包括padding和boder,而content-box的宽高会包含这两

元素垂直居中的方法有哪些?

如果是文本元素的话就使用line-height等于所在盒子的高度。
如果是块级元素的话可以使用margin的auto属性来使元素垂直居中

BFC是什么?

block formetting context;是高度塌陷

如何让chrome浏览器显示小于12px的文字

css选择器有哪些?那些属性可以继承,优先级如何计算?

css选择器权重?

行内样式为100
标签选择器为1
类选择器为10
id选择器为100

网页中大量图片加载很慢 你有什么办法进行优化?

  • 可以使用图片懒加载

行内元素/块级元素有哪些?

  • 行内元素有: a ,span
  • 块元素有:div, p

浏览器的标准模式和怪异模式的区别?

标准模式下盒子的宽高主要由三部分组成:content,padding,和border
怪异模式下盒子的宽高只由content盒子决定

margin和padding在什么场合下使用

  • margin主要用于不同的盒子间需要调整间距的情况下使用
  • padding主要是在一个盒子内需要挤压内部的元素的时候使用

弹性盒子布局属性有那些请简述?

  • 水平布局:just-content:space-between,space-around,start,end
  • flex-wrap:wrap/no-warp
  • 垂直布局:align-content:space-between,space-around,start,end

怎么实现标签的禁用?

disable

Flex布局原理

px与rem的区别

px是页面像素点个数的单位,一般是固定不变的
rem是根据页面的字体大小调整的单位

网页的三层结构有哪些?

html:结构层
css:样式层
js:行为层

请简述媒体查询

媒体查询是让页面动态响应的方法

rem缺点

常见的兼容性性一阶段内容中记几个

垂直与水平居中的方式

三栏布局方式两边固定中间自适应

Doctype作用

怎么实现一个三角形

设置一个盒子,宽度高度为0,然后设置边框为需要的宽度 6 ,需要三角形的角朝向那个方向就把其余的几个边框颜色设置为透明

转载请注明出处或者链接地址:https://www.qianduange.cn//article/15458.html
标签
评论
发布的文章

HTML5 地理定位

2024-08-20 09:08:58

HTML5 的真相(一)

2024-08-20 09:08:31

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!