当前位置: 首页 > article >正文

前端开发面试题总结-HTML篇

文章目录

  • HTML面试高频问答
    • 一、HTML 的 src 和 href 属性有什么区别?
    • 二、什么是 HTML 语义化?
    • 三、HTML的 script 标签中 defer 和 async 有什么区别?
    • 四、HTML5 相比于 HTML有哪些更新?
    • 五、HTML行内元素有哪些? 块级元素有哪些? 空(void)元素有哪些?
    • 六、iframe有哪些优点和缺点
    • 七、谈谈你对盒子模型的理解
    • 八、flex的基本使用
    • 九、谈谈对BFC的理解

HTML面试高频问答

一、HTML 的 src 和 href 属性有什么区别?

src 和 href 的核心区别:
在这里插入图片描述

二、什么是 HTML 语义化?

在这里插入图片描述

三、HTML的 script 标签中 defer 和 async 有什么区别?

在这里插入图片描述

四、HTML5 相比于 HTML有哪些更新?

在这里插入图片描述

五、HTML行内元素有哪些? 块级元素有哪些? 空(void)元素有哪些?

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

六、iframe有哪些优点和缺点

在这里插入图片描述

七、谈谈你对盒子模型的理解

在这里插入图片描述

八、flex的基本使用

在这里插入图片描述

九、谈谈对BFC的理解

在这里插入图片描述

清除浮动的代码:

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><style>.parent {background-color: lightblue;/* 创建 BFC */overflow: auto;}.child {float: left;width: 100px;height: 100px;background-color: lightcoral;}</style>
</head><body><div class="parent"><div class="child"></div></div>
</body></html>

防止margain重叠:

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><style>.outer {/* 创建 BFC */overflow: auto;}.box {margin: 20px;background-color: lightgreen;}</style>
</head><body><div class="outer"><div class="box">Box 1</div></div><div class="outer"><div class="box">Box 2</div></div>
</body></html>

相关文章:

前端开发面试题总结-HTML篇

文章目录 HTML面试高频问答一、HTML 的 src 和 href 属性有什么区别?二、什么是 HTML 语义化?三、HTML的 script 标签中 defer 和 async 有什么区别?四、HTML5 相比于 HTML有哪些更新?五、HTML行内元素有哪些? 块级元素有哪些? 空(void)元素有哪些?六、iframe有哪些优点…...

嵌入式学习--江协stm32day4

只能说拖延没有什么好结果&#xff0c;欠下的债总是要还的。 ADC 模拟信号转化为数字信号&#xff0c;例如温度传感器将外部温度的变化&#xff08;模拟信号&#xff09;&#xff0c;转换为内部电压的变化&#xff08;数字信号&#xff09; IN是八路输入&#xff0c;下方是选择…...

【Matlab】连接SQL Server 全过程

文章目录 一、下载与安装1.1 SQL Server1.2 SSMS1.3 OLE DB 驱动程序 二、数据库配置2.1 SSMS2.2 SQL Server里面设置2.3 设置防火墙2.4 设置ODBC数据源 三、matlab 链接测试 一、下载与安装 微软的&#xff0c;所以直接去微软官方下载即可。 1.1 SQL Server 下载最免费的Ex…...

MS8551/MS8552/MS8554 单电源、轨到轨输入输出、高精度运放,可替代AD8551/AD8552/AD8554

MS8551/MS8552/MS8554 单电源、轨到轨输入输出、高精度运放&#xff0c;可替代AD8551/AD8552/AD8554 简述 MS8551/8552/8554 是轨到轨输入输出的高精度运算放大器&#xff0c;它有极低的输入失调电压和偏置电流&#xff0c;单电源电压范围为 1.8V 到 5V 。 MS8551/8552/85…...

什么是 Ansible 主机和组变量

Ansible 是一款强大的自动化工具&#xff0c;可简化配置管理、应用程序部署和预配等 IT 任务。其最有价值的功能之一是能够定义变量&#xff0c;从而为不同的主机和组定制剧本。本文将解释 Ansible 中组变量和主机变量的概念&#xff0c;并通过实际示例说明它们的用法。 Ansib…...

F#语言的区块链

F#语言在区块链中的应用 引言 区块链技术在过去十年中迅速崛起&#xff0c;成为了推动金融、供应链、物联网等多个领域创新的重要力量。近年来&#xff0c;随着区块链技术的普及&#xff0c;各种编程语言也纷纷被应用于区块链的开发中。F#语言作为一种功能性编程语言&#xf…...

9.RV1126-OPENCV 视频的膨胀和腐蚀

一.膨胀 1.视频流的膨胀流程 之前膨胀都是在图片中进行的&#xff0c;现在要在视频中进行也简单&#xff0c;大概思路就是&#xff1a;获取VI数据&#xff0c;然后把VI数据给Mat化发给VENC模块&#xff0c;然后VENC模块获取&#xff0c;这样就完成了。流程图&#xff1a; 2.代…...

查找 Vue 项目中未使用的依赖

在 Vue 项目中查找未使用的依赖可以通过以下几种方法&#xff1a; 1. 使用 depcheck 工具 depcheck 是一个专门用于查找项目中未使用依赖的工具。 安装&#xff1a; bash npm install -g depcheck使用&#xff1a; bash depcheck它会列出&#xff1a; 未使用的依赖缺失…...

华为OD机考-内存冷热标记-多条件排序

import java.util.*;public class DemoTest5 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseint a in.nextInt();int[] arr new int[a];for(int…...

UDP 与 TCP 调用接口的差异:面试高频问题解析与实战总结

在日常开发中&#xff0c;我们经常使用封装良好的 TCP 协议栈&#xff0c;比如 HTTP 客户端、Moudou 网络库等&#xff0c;因此很少从“裸 API”角度深入了解 TCP 和 UDP 的套接字调用流程。但在一些系统底层开发或者网络编程面试中&#xff0c;常被问到“TCP 和 UDP 的调用流程…...

AI时代:学习永不嫌晚,语言多元共存

最近看到两个关于AI的两个问题&#xff0c;“现在开始学习AI&#xff0c;是不是为时已晚&#xff1f;”、“AI出现以后&#xff0c;翻译几乎已到末路&#xff0c;那么&#xff0c;随着时代的进步&#xff0c;中文会一统全球吗&#xff1f;” 联想到自己正在做的“万能AI盒”小程…...

『React』Fragment的用法及简写形式

在 React 渲染组件时&#xff0c;每个组件只能返回一个根节点&#xff08;root element&#xff09;。传统上&#xff0c;如果我们需要渲染多条并列的元素&#xff0c;通常会使用一个多余的 <div> 或者其他容器标签将它们包裹起来。但是&#xff0c;这样会在最终的 HTML …...

强化学习入门:交叉熵方法数学推导

前言 最近想开一个关于强化学习专栏&#xff0c;因为DeepSeek-R1很火&#xff0c;但本人对于LLM连门都没入。因此&#xff0c;只是记录一些类似的读书笔记&#xff0c;内容不深&#xff0c;大多数只是一些概念的东西&#xff0c;数学公式也不会太多&#xff0c;还望读者多多指教…...

CSS3 的特性

目录 CSS3 的特性CSS3 的三大特性1. 层叠性2. 继承性3. 优先级 CSS3 新增特性1. 选择器2. 盒模型3. 背景4. 渐变5. 过渡6. 动画7. 2D/3D 变换8. 弹性布局9. 网格布局10. 媒体查询11. 多列布局12. 文字阴影和盒子阴影 CSS3 的特性 CSS3 的三大特性 1. 层叠性 定义&#xff1a…...

Vue前端篇——Vue 3的watch深度解析

&#x1f4cc; 前言 在 Vue.js 的世界中&#xff0c;“数据驱动”是其核心理念之一。而在这一理念下&#xff0c;watch 扮演着一个非常关键的角色。它允许我们监听响应式数据的变化&#xff0c;并在其发生变化时执行特定的业务逻辑。 本文将通过实际代码示例&#xff0c;深入…...

行为型设计模式之Mediator(中介者)

行为型设计模式之Mediator&#xff08;中介者&#xff09; 1&#xff09;意图 用一个中介对象来封装一系列的对象的交互。中介者使各对象不需要显示的相互引用&#xff0c;从而使其耦合松散&#xff0c;而且可以独立地改变它们之间的交互。 2&#xff09;结构 其中&#xff…...

三维图形、地理空间、激光点云渲染技术术语解析笔记

三维图形、地理空间、激光点云渲染技术术语解析笔记 code review! 文章目录 三维图形、地理空间、激光点云渲染技术术语解析笔记1. Minecraft风格的方块渲染2. Meshing&#xff08;网格化&#xff09;3. Mipmapping&#xff08;多级纹理映射&#xff09;4. Marching Cubes&…...

从webrtc到janus简介

1.基础知识 1.1 信令的基础知识 在 WebRTC&#xff08;Web Real-Time Communication&#xff09; 中&#xff0c;信令&#xff08;Signaling&#xff09; 是实现浏览器之间实时通信的关键机制&#xff0c;负责在通信双方&#xff08;或多方&#xff09;之间传递控制信息&…...

JVM 核心概念深度解析

最近正在复习Java八股&#xff0c;所以会将一些热门的八股问题&#xff0c;结合ai与自身理解写成博客便于记忆 一、JVM内存结构/运行时数据区 JVM运行时数据区主要分为以下几个部分&#xff1a; 程序计数器(PC Register) 线程私有&#xff0c;记录当前线程执行的字节码行号唯…...

api将token设置为环境变量

右上角 可以新增或者是修改当前的环境 环境变量增加一个token,云端值和本地值可以不用写 在返回token的接口里设置后执行操作&#xff0c;通常是登录的接口 右侧也有方法提示 //设置环境变量 apt.environment.set("token", response.json.data.token); 在需要传t…...

SIFT算法详细原理与应用

SIFT算法详细原理与应用 1 SIFT算法由来 1.1 什么是 SIFT&#xff1f; SIFT&#xff0c;全称为 Scale-Invariant Feature Transform&#xff08;尺度不变特征变换&#xff09;&#xff0c;是一种用于图像特征检测和描述的经典算法。它通过提取图像中的局部关键点&#xff0c;…...

AlphaDrive:通过强化学习和推理释放自动驾驶中 VLM 的力量

AlphaDrive: Unleashing the Power of VLMs in Autonomous Driving via Reinforcement Learning and Reasoning 25年3月来自华中科技大学和地平线的论文 OpenAI 的 o1 和 DeepSeek R1 在数学和科学等复杂领域达到甚至超越了人类专家水平&#xff0c;其中强化学习&#xff08;R…...

【八股消消乐】如何解决SQL线上死锁事故

&#x1f60a;你好&#xff0c;我是小航&#xff0c;一个正在变秃、变强的文艺倾年。 &#x1f514;本专栏《八股消消乐》旨在记录个人所背的八股文&#xff0c;包括Java/Go开发、Vue开发、系统架构、大模型开发、具身智能、机器学习、深度学习、力扣算法等相关知识点&#xff…...

如何使用 HTML、CSS 和 JavaScript 随机更改图片颜色

原文&#xff1a;如何使用 HTML、CSS 和 JavaScript 随机更改图片颜色 | w3cschool笔记 &#xff08;请勿标记为付费&#xff01;&#xff01;&#xff01;&#xff01;&#xff09; 在网页开发中&#xff0c;为图片添加动态效果可以显著提升用户体验。今天&#xff0c;我将向…...

html如何在一张图片上的某一个区域做到点击事件

在HTML中&#xff0c;可以通过<map>和<area>标签来实现对图片的某个区域添加点击事件。这种方法通常用于创建图像地图&#xff08;Image Map&#xff09;&#xff0c;允许用户点击图片的不同区域触发不同的事件。 以下是实现步骤和代码示例&#xff1a; 1. 准备图…...

Java数据校验:确保数据完整性和正确性

在软件开发中&#xff0c;数据校验是确保应用程序数据完整性和正确性的关键步骤。Java 提供了多种方式来实现数据校验&#xff0c;从简单的条件检查到复杂的框架支持。在这篇博客中&#xff0c;我们将探讨 Java 中数据校验的重要性、常用的校验注解以及如何整合校验框架来提高代…...

Java-IO流之序列化与反序列化详解

Java-IO流之序列化与反序列化详解 一、序列化与反序列化概述1.1 基本概念1.2 核心接口与类1.3 应用场景 二、Java序列化的基本实现2.1 实现Serializable接口2.2 使用ObjectOutputStream进行序列化2.3 使用ObjectInputStream进行反序列化 三、序列化的高级特性3.1 serialVersion…...

机器学习14-迁移学习

迁移学习学习笔记 一、迁移学习概述 迁移学习是机器学习中的一个重要领域&#xff0c;它旨在解决当目标任务的训练数据有限时&#xff0c;如何利用与目标任务相关但不完全相同的源任务数据来提高学习性能的问题。在现实世界中&#xff0c;获取大量高质量的标注数据往往成本高…...

CAN通信收发测试(USB2CAN模块测试实验)

1.搭建测试环境 电脑&#xff1a;安装 USB 驱动&#xff0c;安装原厂调试工具&#xff0c;安装cangaroo&#xff08;参考安装包的入门教程即可&#xff09; USB驱动路径&#xff1a;~\CAN分析仪资料20230701_Linux\硬件驱动程序 原厂调试工具路径&#xff1a;~\CAN分析仪资料2…...

小白初学SpringBoot记录

1.对于通过json返回用户信息时&#xff0c;需要忽略password字段操作&#xff1a; 1.1 pom配置jackson细节&#xff1a; <dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><version>…...