HTML前端面试知识点

已于 2022-03-07 16:48:35 修改
阅读量448 收藏
点赞数
分类专栏： # 前端面试题目汇总 文章标签： 前端 html 面试
于 2021-11-02 11:33:42 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yunxiu988622/article/details/121089206
版权

一、HTML语义化

1、什么叫语义化

HTML语义化 & 网页布局

  • 例子：没有语义化的时候< div id=“header”> 使用语义化之后 < header>< /header>
  • 含义：说白了，让 HTML文本 语义化，就是让 HTML标签 能够表明其内部 内容的意义，让机器能读懂你的网页

2、为什么要语义化

在这里插入图片描述

在这里插入图片描述

3、 HTML5新增的标签

在HTML5出来之前，我们习惯于用div来表示页面的章节或者不同模块，但是div本身是没有语义的。但是现在，HTML5中加入了一些语义化标签，来更清晰的表达文档结构。如图，这个页面结构中摒弃了所有div元素，取而代之的是HTML5语义化标签(用哪些标签取决于你的设计目的)。

Header nav main section article aside footer stong em small
在这里插入图片描述
em强调文本 标签修饰的内容都是用斜体字来显示

在这里插入图片描述

4、 b和strong的区别（em）？

  • 共同点：两者虽然在网页中显示效果一样,但实际目的不同。 < b>为了加粗而加粗，< strong> 为了标明重点而加粗。
  • 区别：最重要的区别的就是样式标签与语义化标签的区别。最容易理解的场景就是盲人朋友使用阅读设备阅读网页时: < strong> 会重读，< b>不会
    < em>标签强调效果仅次于< strong> 标签

二、HTML5

1、 Doctype的作用

在这里插入图片描述

2、 如何区分html和html5?

① 文档类型声明

<!-- html声明 --> 
<!DOCTYPE html PUBLIC "-/ /W3C/ /DTD XHTML 1.0 Transitional/ /EN" "http://mw.w3.org/TR/xhtn11/DTD/xhtml transitional.dtd"> 
 
<!-- html5声明 -->
<!DOCTYPE html>

② 结构语义

Html:没有体现结构语义化的标签，Html5有

3、HTML、XHTML、XML有什么区别

在这里插入图片描述
XML 可以自己“发明”标签————这也是“可扩展的”一个含义。
所有 XML 元素都须有关闭标签，XML 元素使用 XML 标签进行定义。
XML存储数据的例子

三 、特殊标签和属性

1、meta标签

meta标签中的http-equiv属性
在这里插入图片描述

  • name属性主要用于描述网页，与之对应的属性值为content，content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的
  • http-equiv顾名思义，相当于http的文件头作用，它可以向浏览器传回一些有用的信息，以帮助正确和精确地显示网页内容，与之对应的属性值为content，content中的内容其实就是各个参数的变量值。
<!DOCTYPE html>
<html lang="en">
 向搜索引擎表示该页面是html语言，并且语言为英文网站，其"lang"的意思就是“language”，“en”即表示english中文页面 "zh"
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
</html>

<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript"> 定义文档关键词，用于搜索引擎：
<meta http-equiv="refresh" content="30"> 每30秒刷新页面：

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

charset=utf-8 表示当前文档的字符集是采用utf-8的字符，也就是我们常说英文字符集

2、script标签中defer和async属性的区别

在这里插入图片描述

在这里插入图片描述

3、src和href的区别（a和link的区别）？

① src

在这里插入图片描述

② herf

在这里插入图片描述

③ src和href的区别

在这里插入图片描述

④ img的srcset的作用是什么

在这里插入图片描述

四、优雅降级和渐进增强

在这里插入图片描述

4、img标签的tittle和alt

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

五、iframe

iframe跨域数据传递 postMessage

秀秀的奇妙旅行
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
前端十五道html面试题
m0_65450343的博客
04-17 4022
01.说一下对语义化的理解？✅ 对开发者友好，让人更容易读懂，利于代码可读性 对机器友好，让搜索引擎更容易读懂，利于seo 02.说一下iframe有哪些优点和缺点？✅ 优点：展现嵌入的网页；加载速度较慢的内容，如广告；可以跨子域通信； 缺点：iframe会阻塞主页面onload事件；不利于搜索引擎识别；增加http请求； 03.DOCTYPE的作用？严格模式和混杂模式的区别？ ！DOCTYPE告诉浏览器以HTML5标准解析页面，如果不写，则进入混杂模式 严格模式（标准模式）：以w3c标准解析
前端面试知识点
小允子的博客
05-31 8089
答案已在最下方公布。 1、以下是HTML5新增的标签是：     A、  B、  C、    D、 2、以下不是HTML5的新增的标签是：     A、    B、      C、     D、 3、以下不是HTML5新增的API是     A、Media API    B、Command API      C、History API     D、Cookie API 4、以下说
HTML标签----图文详解（二）
weixin_34364071的博客
10-02 311
本文最初于2015-10-02发表于博客园，并在GitHub上持续更新前端的系列文章。欢迎在GitHub上关注我，一起入门和进阶前端。 以下是正文。 HTML标签超详细的图文演示再来一波~~~ 如果还没有看过昨天的福利的，那可要抓紧喽，传送门：HTML标签----图文详解 本文主要内容 列表标签：&lt;ul&gt;、&lt;OL&gt;、&lt;dl&gt; 表格标签：&lt;tabl...
HTML最新面试题（笔试面试题）
热门推荐
xingyu_qie的专栏
11-30 4万+
HTML我们也学了那么久了，是时候看一些面试题了，毕竟学习完找工作要面试，你工作能力再强，面试这一关还是要过得。所以面试题占了很重要的成分。下面我来总结一部分，尽量全面一些，既要接近我们所学，又要满足真实面试场景。 1、请说出XHTML和HTML的区别 答：1、文档顶部doctype声明不同，xhtml的doctype顶部声明中明确规定了xhtml DTD的写法； ...
【面试题】常见前端基础面试题（HTML,CSS,JS）_后端js和html面试
最新发布
2401_85123473的博客
06-11 271
var 定义的变量，是函数作用域，没有块的概念，可以跨块访问, 不能跨函数访问，有变量提升。let 定义的变量，只能在块作用域里访问，不能跨块访问，也不能跨函数访问，无变量提升，不可以重复声明。const 用来定义常量，使用时必须初始化(即必须赋值)，只能在块作用域里访问，而且不能修改，无变量提升，不可以重复声明。var不存在暂时性死区,let和const存在暂时性死区let和const创建的全局变量没有给window设置相应的属性暂时性死区：使用。
前端开发面试题——HTML部分
u010165223的博客
02-20 1036
浏览器内核（Browser Engine）是浏览器的核心组成部分之一，负责解析 HTML、CSS 和 JavaScript，并将其渲染成可视化的网页内容。浏览器内核通常由两部分组成：渲染引擎（Rendering Engine）和 JavaScript 引擎（JavaScript Engine）。渲染引擎负责解析 HTML、CSS 等文档，构建 DOM 树（文档对象模型）、CSSOM 树（CSS 对象模型）和渲染树（Render Tree）。
前端面试系列初章——HTML & CSS 篇
Web面试那些事儿的博客
12-04 913
如果你现在正在找工作，可以私信“web”进群领取前端面试小册、简历优化修改、大厂内推以及更多阿里、字节大厂面试真题合集，和p8大佬一起交流。
web前端面试知识点
Arui_0的博客
06-13 187
一、H5 新特性 本地存储 webStorage websocket webworkers 新增地理位置等API 对css3的支持 canvas 多媒体标签 新增表单元素类型 结构标签：header nav article aside footer 表单标签：email url range date 媒体标签：video audio …… 二、css3 新特性 圆角：border-radius 阴影：box-shadow 背景渐变：https://developer.mozilla.org/zh-CN/do
前端面试知识点目录一览
10-17
前端面试知识点涵盖的范围非常广泛，从基础的HTML语义化标签到复杂的Vue框架源码阅读，以及工程能力的考察，都需要面试者有深入的理解和实践经验。以下是对给定文件内容的详细知识点梳理： HTML标签和SEO优化： - ...
前端面试知识点梳理
03-03
以下将详细介绍前端面试中可能被问及的知识点。 1. **HTML + CSS 基础布局** - HTML 是网页的骨架，CSS 是用来美化和布局的。掌握基础的HTML标签和CSS样式对于任何前端开发者都是必要的。 - 在布局方面，需要了解...
前端面试宝典（前端知识）
12-23
【前端面试宝典】是为准备前端面试的开发者量身打造的一份综合指南，涵盖了前端领域的核心知识。本文将深入探讨其中的一些关键知识点。 1. **HTML** - **HTML5特性**：包括离线存储（AppCache）、拖放功能、媒体...
html+css+js面试总结
11-08
前端基础知识面试必备，面试中基本上所有的基础知识都涵盖在内。
2023最新前端面试宝典
09-10
【前端面试知识点详解】 在2023年的前端面试中，掌握计算机网络、HTML、CSS、JavaScript以及Vue等核心技术是至关重要的。以下是这些知识点的详细分析： 1. **计算机网络 - HTTP与HTTPS** - **HTTP**：超文本传输...
HTML前端面试题（持续更新中）
Lilly_1116的博客
08-25 1054
前端面试汇总，不断更新ing
全面的html面试知识点
song854601134的博客
12-30 329
文章目录@[toc]1. HTML、XML、XHTML 的区别2. 什么是HTML5以及和HTML的区别是什么概念区别3. HTML、XHTML和HTML5区别以及有什么联系XHTML与HTML的区别XHTML与HTML5的区别HTML、XHTML、HTML5之间联系4. HTML5 为什么只需要写5. 行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？6. 页面导入样式时，使用link和@import有什么区别7. 支持HTML5的浏览器有哪些8. Label 的作用是什么？ 怎么用？9. 标签
Web前端最全【前端面试题】 HTML+CSS篇，2024年前端社招面试题
2401_84411767的博客
05-08 647
对于应届生或工作年限不长的人来说，刷面试题一方面能够尽可能地快速自己对某个技术点的理解，另一方面在面试时，有一定几率被问到相同或相似题，另外或多或少也能够为自己面试增加一些自信心，可见适当的刷题是很有必要的。对于应届生或工作年限不长的人来说，刷面试题一方面能够尽可能地快速自己对某个技术点的理解，另一方面在面试时，有一定几率被问到相同或相似题，另外或多或少也能够为自己面试增加一些自信心，可见适当的刷题是很有必要的。大厂面试远没有我们想的那么困难，摆好心态，做好准备，你也可以的。transform 转变动画。
前端面试集锦—html
arvin的博客
08-04 193
好久没发文章了，主要是这段时间太忙了，在写Python，由于公司最近没有前端的项目，所以只能去写后端的代码了，终于能抽个时间发篇文章了，这几个月是招工季，所以就整理了一下面试题发了出来，后续还会有js、css、Vue的其他面试。 版权声明：本篇文章是作者辛辛苦苦通过网络整理的面试题，转载请注明转载来源 在这里插入代码片 1、HTML5 有哪些新特性？ 1.语义化标签 例如：<header>、<footer>、><nav>、<aside>、&l.
Html 小结
weixin_44433499的博客
03-30 395
1. HTML、XML、XHTML 的区别 HTML：超文本标记语言，是语法较为松散的、不严格的Web语言； XML：可扩展的标记语言，主要用于存储数据和结构，可扩展； XHTML：可扩展的超文本标记语言，基于XML，作用与HTML类似，但语法更严格。 2. 什么是HTML5以及和HTML的区别是什么 概念 HTML5是HTML的新标准，其主要目标是无需任何额外的插件如Flash、Silverlight等，就可以传输所有内容。它囊括了动画、视频、丰富的图形用户界面等。 HTML5是由万维网联盟（W3C）和W
最全前端 HTML 面试知识点
原来是有理数
01-28 1052
最全前端 html 相关知识点总结
前端开发面试知识点大纲：HTML
前端开发面试知识点大纲：HTML 根据以上论述提供的信息，文件 "前端大厂最新面试题-前端开发面试.docx" 是一份拥有1500字中文描述的文件。这份文件主要关于前端开发领域的面试题目和知识点整理。 这个文件的命名...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值