2025年前端面试准备html篇

1.对html 语义化标签的理解

　　html语义化标签简单来说页面有良好的结构，使元素有含义便于理解。

　　优点可以使页面呈现出清晰的机构，有利于seo和搜索引擎抓取信息，便于团队的开发和管理。

　　常见的语义化标签有：

复制代码

　　　　<header> - 定义页面或区段的头部<nav> - 定义导航链接 <main> - 定义页面的主要内容，一个页面只能使用一次<article> - 定义独立的文章内容<section> - 定义文档中的一个区段<aside> - 定义与页面主内容 minor 相关的内容<footer>- 定义页面或区段的底部。

复制代码

2.常见的块级级元素

　　p、div、form、ul、li、ol、table、h1、h2、h3、h4、h5、h6、dl、dt、dd

　　　　块级元素会单独站一行，默认顺序是从上到下的

　　　　在没有设置宽度的时候宽度是100%

　　　　块级元素里面可以写行内元素和块级元素

3. 常见的行内元素

　　span、a、img、button、input、select、 i、strong、em、lable、b、

　　　　行内元素和其他元素会在一行且设置宽度高度无效，可以通过line-heigth 设置高度，不会破坏文本流

　　　　设置margin 和 padding 只有左右生效其他无效

　　　　宽度不是不能改的只能是文字宽度或者图片宽度，行内元素只能容纳行内元素。

4.html5 新增了哪些属性常用的

　　html5 主要关于图像，位置，存储，多任务等。

　　视频video 音频audio 画布canvas

　 img的 srcset 属性：允许你为不同的屏幕分辨率和设备特性提供多个图像源

<img src="image.jpg" srcset="image2x.jpg 2x, image3x.jpg 3x" alt="description">

　　input 标签新增type email url number range date month week time datetime

　　本地存储 localStorage 长期存储数据需要手动清除

　　sessionStorage 浏览器关闭后自动删除

5.meta viewport 的用法

　　viewport 是用来适配移动端，可以用来控制长窗口的大小和比例

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

　　width viewport ：宽度(数值/device-width)

　　height viewport ：高度(数值/device-height)

　　initial-scale ：初始缩放比例为一个数字，可以带小数

　　maximum-scale ：最大缩放比例为一个数字，可以带小数

　　minimum-scale ：最小缩放比例为一个数字，可以带小数

　　user-scalable ：是否允许用户缩放(yes/no）

6.cookie,sessionStorage和localStorage 的区别

	cookie	localStorage	sessionStorage
初始化设置	客户端或者服务器，服务器可以通过Set-Cookie 设置请求头	客户端	客户端
是否永久存储	手动设置	永久设置	当前页面关闭时
在浏览器绘画中是否保持不变	是否设置了过期时间	是	否
是否跟随请求返回给服务器	Cookie 会通过请求头自动发送给服务器	否	否
容量	4kb	5MB	5MB
访问权限	当前浏览器任意窗口	当前浏览器任意窗口	当前窗口