html理论

1.什么是HTML?

Html是超文本标记语言是一种用于创建网页的标准标记语言。

  1. DOCTYPE 的作用是什么?

起到一个声明作用,告知浏览器以什么标准解析该文档DOCTYPE不存在或者格式不正确会导致文档以兼容模式呈现

3.编码集的作用是什么?说出几个常见的编码集?为什么常用utf-8?

编码集的作用是定义了一种字符与二进制数字对应的规则,使得计算机可以存储、传输和处理文本信息‌。

UTF-8 UTF-16 UTF-32 ASCII

UTF-8: ‌兼容性强,‌空间利用率高‌,‌国际化支持等优点

4.meta viewport(视口)是什么? 原理是什么?

该meta标签的作用:是让当前viewport(视口)的宽度等于设备的宽度,同时不允许用户手动缩放。

原理:是通过设置视口的宽度和缩放级别来控制网页在移动设备上的显示效果。

5.行内元素有哪些?块级元素有哪些? 行内块元素有那些?他们有什么区别?

行内元素:span a b u i等 不独占一行,不可设宽高

块级元素:div p h1-h6 ol li等 独占一行,可设宽高

行内块元素:img button input等 不独占一行,可设宽高

6.标签上的 title 属性与 alt 属性的区别是什么?

title:图片显示时鼠标放上去时显示的注释

alt:图片未显示时,显示出的文本

7.对WEB标准以及W3C的理解与认识

WEB标准是用于开发和解析网页的一系列规范和技术标准,为了确保网页在不同浏览器和设备上的一致性、可访问性和可持续性。

W3C是一个制定各种标准的非盈利性组织,也叫万维网联盟

8.前端页面有哪三层构成,分别是什么,作用是什么?

结构层 html 搭建文档结构

样式层 css 设置文档呈现效果

行为层 js 设置文档的动态行为

9.什么是iframe(内联)?请讲述一下iframe(内联)的优缺点?

iframe是一个行内块元素,允许在HTML文档中嵌入另一个HTML页面。

优点:通过使用iframe,可以在主页面内嵌套子页面,实现网页的层次化和模块化,解决加载缓慢问题,能加载脚本,方便管理

缺点:镶嵌的网页大小固定,移动端可能体验感不好

滥用可能会导致网页加载变慢,性能变低

10.Form(表单)的作用

form的主要作用是收集用户输入的数据,并将其发送到服务器进行处理和验证‌。

11.HTML中有哪些属于表单元素?那些属于表格元素?请分别列举5个并说明用途

表单:1,Input 用于收集用户输入 2.Textarea 用于多行文本输入 3.Button 用于定义一个按钮 4. Selec创建一个下拉框 5.Label 为input元素定义标签

表格:1.Table定义一个表格 2.Tr定义一个表格行 3.Th 定义一个表格的表头单元格 4.Td 定义一个表格的单元格 5. Thead标签‌:用于组合行或列的表头单元格。

12.如何定义一个单选按钮?

13.Input(输入框)只读,禁用,必填,提示词(占位符)属性分别是什么?

1.Readonly只读 属性规定https://so.csdn.net/so/search?q=输入字段\&spm=1001.2101.3001.7020 为只读(不能修改)

2.Disabled禁用 属性规定输入字段是禁用的

3.required必填 属性规定必需在提交之前填写输入字段 4.placeholder(占位符) 是 HTML5 新增的一个 HTML 属性,用来对可输入字段的期望值提供提示信息

14.input(输入框)的type(种类)属性一共有多少个值?请写出常用的13种,并写出每种类型的应用场景

① 基础文本输入类:

text 单行文本输入框 password 密码输入框 email 邮箱输入框 tel 电话号码输入框 url 网址输入框 search 搜索输入框

② 数值 / 数字输入类:

number 数字输入框 range 滑块输入控件 date 日期选择器 month 月份选择器

week 周选择器 time 时间选择器 datetime-local 本地日期时间选择器

③ 选择 / 开关类:

checkbox 复选框 radio 单选按钮 file 文件上传控件 hidden 隐藏输入框

button 普通按钮 submit 提交按钮 reset 重置按钮 color 颜色选择器

datetime 日期时间选择器

④ 非标准 / 已废弃的input type值(极少使用,不推荐):

isindex 早期用于创建单行文本搜索框,现用text代替

image 图片提交按钮

15.input(输入框)的disabled(禁用)属性 和 readonly(只读)属性 的区别?

禁用:不可点击、编辑、提交和修改

只读:不能编辑和修改,但可以传输数据

16.label(标签) 的作用是什么?是怎么用的?

作用:当用户选择该标签时,浏览器会自动聚焦转到标签相关的表单控件上。

用法:将 和一个 元素匹配在一起,你需要给 一个 id 属性。而 需要一个 for 属性,其值和 的 id 一样。
17.datalist (dā-tē-līst)(下拉列表)是什么?有什么用?
datalist 作用:显示下拉列表,但是可以根据输入自动对数据进行排序和过滤
18.input(输入框)的name(名称)属性的作用是什么?
name 属性规定 input 元素的名称,用户提交时向服务器提交数据
19.相对、绝对路径的区别是什么?
相对路径则是基于当前工作目录的路径
绝对路径提供了从文件系统的根目录到目标文件或目录的完整路径
20.jpg、png、gif的区别是什么?如何进行选择?
jpg是一种有损压缩格式,适用于保存照片和其他的复杂图像,一般适用于照片。
png是一种无损压缩,可以保存透明度信息,一般适用于背景图标和图像。
gif是256色无损,编辑保存的时候,不会损失,适合做动画。
21.请说出五种html5新增的内容
{音频,视频},画布,新的声名方式,离线存储,语义化标签
地理位置,增强型表单,svg绘图,拖拉APl
22.canvas(画布)和svg(矢量图形)的区别是什么?它们的应用场景是什么?
canvas适合游戏、图表和动画。易于处理复杂的像素级操作,适合复杂的动态内容
svg 矢量图形可以无限放大而不失真,支持交互和动画,更适合静态和可交互的图形。

相关推荐
IT_陈寒1 小时前
Java的HashMap竟然不是线程安全的,现在才知道!
前端·人工智能·后端
IT_陈寒1 小时前
React hooks闭包陷阱让我加了一宿班
前端·人工智能·后端
不一样的少年_1 小时前
设计稿里的图片明明很清晰,为什么到了手机上却糊了?一文讲透 DPR、压缩与格式选择
前端·后端·图片资源
计算机魔术师1 小时前
OpenAI内部数据曝光:AI已经替人类写了3.1倍的研究代码
前端
心易行者1 小时前
用html在线运行做数据可视化大屏,5个实战场景从入门到上线
大数据·前端·数据库·人工智能·python
光影少年1 小时前
从输入URL到页面渲染,React/RN 整体加载流程
前端·javascript·react native·react.js·前端框架
兔子零10241 小时前
我给 Pi Coding Agent 做了一个桌面控制台:Pi-Harness
前端·javascript·后端
Kevin Coding1 小时前
鸿蒙 emitter/EventHub 没有 Sticky 粘性事件?手写一个轻量级 EmitterManager 解决
前端·华为·前端框架·移动开发·harmonyos
Rescenix1 小时前
agent前台被批量举报的复盘:频率特征 + uv venv shim 幻影导致的进程双开误判
前端·人工智能