前端_001_html扫盲
文章目录
- 概念
- 标签及属性
- 常用全局属性
- head里常用标签
- body里常用标签
- 表情符号
- url编码
概念
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body></body>
</html>
<!DOCTYPE html>
表示用的html规范
其他就是html的概念,标签和属性
标签及属性
常用全局属性
每个标签都有的属性
常用标签
属性 | 描述 |
---|---|
accesskey | 规定激活元素的快捷键。 |
class | 规定元素的一个或多个类名(引用样式表中的类)。 |
contenteditable | 规定元素内容是否可编辑。 |
dir | 规定元素中内容的文本方向。 |
draggable | 规定元素是否可拖动。 |
dropzone | 规定在拖动被拖动数据时是否进行复制、移动或链接。 |
hidden | 规定元素仍未或不再相关。 |
id | 规定元素的唯一 id。 |
lang | 规定元素内容的语言。 |
popover | 规定弹出框元素。 |
spellcheck | 规定是否对元素进行拼写和语法检查。 |
style | 规定元素的行内 CSS 样式。 |
title | 规定有关元素的额外信息。 |
重点
id,class,style,title
head里常用标签
1.标题<title>2.文档字符编码 <meta charset="utf-8" />
<meta> 还能用于搜索引擎优化3.指定文档图标
<link rel="icon" href="/favicon-48x48.[some hex hash].png" />4.引入css样式
<link rel="stylesheet" href="my-css-file.css" /> 5.引入js脚本
<script src="my-js-file.js" defer ></script> //defer属性表示该脚本会在DOM加载完后执行
6.直接写css样式
<style>p {color: #26b72b;}code {font-weight: bold;}
</style>
总结head里常用标签
title
meta
link
style
script
body里常用标签
1.标题
<h1>标题</h1>
2.段落
<p>3.上标下标
<sub> <sup> 4.链接(主要是超链接和锚点作用)
<a href> 5.图片
<img> <map> 6.表格
<table> 7.列表
<ul> <ol>8.框架 内嵌一个html
<iframe> 9.表单
<form> <input> 10.图形
<canvas> <svg>11.音频
<audio> 12.视频
<video>
表情符号
&# + 数字
https://www.w3ccoo.com/charsets/ref_emoji.asp
url编码
url传输只能传ASCII编码,因此需要进行编解码后再进行传输
参考:
[HTML 基础 - 学习 Web 开发 | MDN (mozilla.org)](https://www.cainiaojc.com/tags/ref-byfunc.html)
https://www.w3school.com.cn/html/index.asp
相关文章:
前端_001_html扫盲
文章目录 概念标签及属性常用全局属性head里常用标签body里常用标签表情符号 url编码 概念 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>Title</title> </head> <body></bod…...

49 | 桥接模式:如何实现支持不同类型和渠道的消息推送系统?
上一篇文章我们学习了第一种结构型模式:代理模式。它在不改变原始类(或者叫被代理类)代码的情况下,通过引入代理类来给原始类附加功能。代理模式在平时的开发经常被用到,常用在业务系统中开发一些非功能性需求…...

使用js和canvas实现简单的网页贪吃蛇小游戏
玩法介绍 点击开始游戏后,使用键盘上的↑↓←→控制移动,吃到食物增加长度,碰到墙壁或碰到自身就游戏结束 代码实现 代码比较简单,直接阅读注释即可,复制即用 <!DOCTYPE html> <html lang"en"…...
Kafka SASL/PLAIN认证模式
Kafka 认证模式命令使用示例 创建Topic 指定用户创建 [rootkafka01 kraft]# /usr/local/kafka3.5-sasl-data/bin/kafka-topics.sh --bootstrap-server x.x.x.11:9092 --create --topic fkaaa35 --replication-factor 3 --partitions 3 --command-config /usr/local/kafka3.…...

苹果AI科学家研究证明基于LLM的模型存在缺陷 因为它们无法推理
苹果公司人工智能科学家的一篇新论文发现,基于大型语言模型的引擎(如 Meta 和 OpenAI 的引擎)仍然缺乏基本的推理能力。该小组提出了一个新的基准–GSM-Symbolic,以帮助其他人衡量各种大型语言模型(LLM)的推…...

鸿蒙NEXT开发-页面路由(基于最新api12稳定版)
注意:博主有个鸿蒙专栏,里面从上到下有关于鸿蒙next的教学文档,大家感兴趣可以学习下 如果大家觉得博主文章写的好的话,可以点下关注,博主会一直更新鸿蒙next相关知识 专栏地址: https://blog.csdn.net/qq_56760790/…...
asp.net Core MVC 内容协商
内容协商 内容协商是Asp.Net Core 控制器的一项功能,而Asp.Net MVC5 控制器并不支持它。 引入内容协商是为了满足 Web API 框架的需要。 在 Asp.net Core 中,内容协商 被内置到引擎中,供开发人员使用。 顾名思义,内容协商指的是…...
智能EDA小白从0开始 —— DAY10 Yosys
Yosys 概述 工作原理 Yosys的工作原理深入来讲,是一个复杂但有序的硬件设计自动化流程,其核心在于将高级硬件描述语言(HDL)如Verilog或VHDL编写的代码,通过一系列精细的步骤转换为门级网表。这一流程首先涉及对HDL代…...

《OpenCV计算机视觉》—— 人脸检测
文章目录 一、人脸检测流程介绍二、用于人脸检测的关键方法1.加载分类器(cv2.CascadeClassifier())2.检测图像中的人脸(cv2.CascadeClassifier.detectMultiscale()) 三、代码实现 一、人脸检测流程介绍 下面是一张含有多个人脸的…...

【unity框架开发12】从零手搓unity存档存储数据持久化系统,实现对存档的创建,获取,保存,加载,删除,缓存,加密,支持多存档
文章目录 前言一、Unity对Json数据的操作方法一、JsonUtility方法二、Newtonsoft 二、持久化的数据路径三、数据加密/解密加密方法解密方法 四、条件编译指令限制仅在编辑器模式下进行加密/解密四、数据持久化管理器1、存档工具类2、一个存档数据3、存档系统数据类4、数据存档存…...
YOLOv11进行图像与视频的目标检测
一、AI应用系统实战项目 项目名称项目名称1.人脸识别与管理系统2.车牌识别与管理系统...

SpinalHDL之错误集(一)
本文作为SpinalHDL学习笔记第七十六篇,作为错误集使用,类似高中生的错题集,记录使用SpinalHDL过程中遇到的问题,小到语法错误、版本兼容问题,大到SpinalHDL库函数错误等等,持续更新。 SpinalHDL学习笔记总…...

【arcgis】ArcGIS中如何避免标注压盖要素
ArcGIS中如何避免标注压盖要素 在制图工作中,标注(Label)是传达地理信息的重要方式。然而,在复杂的地图上,标注容易出现压盖要素的情况,影响地图的美观性和信息的准确传达。ArcGIS提供了Maplex标注引擎&am…...

数通--3
一、动态路由 内部 路由器之间要互联互通,必须遵循相同的协议 企业内部用 IGP,企业之间用BGP RIP(已淘汰,不考) 距离就是长短,矢量就是方向,即路由的出接口 一台路由器 A 配好RIP,…...

SpringBoot基础(五):集成JUnit5
SpringBoot基础系列文章 SpringBoot基础(一):快速入门 SpringBoot基础(二):配置文件详解 SpringBoot基础(三):Logback日志 SpringBoot基础(四):bean的多种加载方式 SpringBoot基础(五):集成JUnit5 目录 一、JUnit…...

正点原子学习笔记之汇编LED驱动实验
1 汇编LED原理分析 为什么要写汇编 需要用汇编初始化一些SOC外设 使用汇编初始化DDR、I.MX6U不需要 设置sp指针,一般指向DDR,设置好C语言运行环境 1.1 LED硬件分析 可以看到LED灯一端接高电平,一端连接了GPIO_3上面…...

网络学习第二篇
认识网关和路由器 这里大家先了解一下什么三层设备。 三层设备 三层设备是指在网络架构中能够工作在第三层(网络层)的设备,通常包括三层交换机和路由器。这些设备可以根据IP地址进行数据包的转发和路由选择,从而在不同的网络之间…...
一些小结汇总
1.常用浏览器及对应内核 Safari浏览器(苹果浏览器):Webkit内核 Google浏览器:Blink内核 Firefox:Gecko内核 Edge浏览器:Chromium内核 IE浏览器:Trident内核 2.10个块标签和10个行标签 …...

20240720 科大讯飞 笔试
文章目录 1、选择题1.11.21.31.41.51.61.71.81.91.101.111.122、编程题2.12.22.33、选择题(Linux 选做)3.13.23.34、选择题(C++ 选做)4.14.24.34.44.54.64.75、选择题(数据库选做)5.15.25.3岗位:嵌入式开发工程师 题型: 必做:12 道选择题,3 道编程题 选做:Linux(3…...

【AIGC】寻找ChatGPT最佳推理步骤:CoT思维链技术的探索与应用
博客主页: [小ᶻZ࿆] 本文专栏: AIGC | ChatGPT 文章目录 💯前言💯CoT思维链概述💯CoT思维链在大型语言模型中的应用💯CoT思维链改变对模型推理能力的理解和改进方式多样化应用场景挑战与未来发展总结 Ὂ…...

Swift 协议扩展精进之路:解决 CoreData 托管实体子类的类型不匹配问题(下)
概述 在 Swift 开发语言中,各位秃头小码农们可以充分利用语法本身所带来的便利去劈荆斩棘。我们还可以恣意利用泛型、协议关联类型和协议扩展来进一步简化和优化我们复杂的代码需求。 不过,在涉及到多个子类派生于基类进行多态模拟的场景下,…...

ESP32读取DHT11温湿度数据
芯片:ESP32 环境:Arduino 一、安装DHT11传感器库 红框的库,别安装错了 二、代码 注意,DATA口要连接在D15上 #include "DHT.h" // 包含DHT库#define DHTPIN 15 // 定义DHT11数据引脚连接到ESP32的GPIO15 #define D…...

如何将联系人从 iPhone 转移到 Android
从 iPhone 换到 Android 手机时,你可能需要保留重要的数据,例如通讯录。好在,将通讯录从 iPhone 转移到 Android 手机非常简单,你可以从本文中学习 6 种可靠的方法,确保随时保持连接,不错过任何信息。 第 1…...
Caliper 配置文件解析:config.yaml
Caliper 是一个区块链性能基准测试工具,用于评估不同区块链平台的性能。下面我将详细解释你提供的 fisco-bcos.json 文件结构,并说明它与 config.yaml 文件的关系。 fisco-bcos.json 文件解析 这个文件是针对 FISCO-BCOS 区块链网络的 Caliper 配置文件,主要包含以下几个部…...

企业如何增强终端安全?
在数字化转型加速的今天,企业的业务运行越来越依赖于终端设备。从员工的笔记本电脑、智能手机,到工厂里的物联网设备、智能传感器,这些终端构成了企业与外部世界连接的 “神经末梢”。然而,随着远程办公的常态化和设备接入的爆炸式…...

【VLNs篇】07:NavRL—在动态环境中学习安全飞行
项目内容论文标题NavRL: 在动态环境中学习安全飞行 (NavRL: Learning Safe Flight in Dynamic Environments)核心问题解决无人机在包含静态和动态障碍物的复杂环境中进行安全、高效自主导航的挑战,克服传统方法和现有强化学习方法的局限性。核心算法基于近端策略优化…...

uniapp手机号一键登录保姆级教程(包含前端和后端)
目录 前置条件创建uniapp项目并关联uniClound云空间开启一键登录模块并开通一键登录服务编写云函数并上传部署获取手机号流程(第一种) 前端直接调用云函数获取手机号(第三种)后台调用云函数获取手机号 错误码常见问题 前置条件 手机安装有sim卡手机开启…...

篇章二 论坛系统——系统设计
目录 2.系统设计 2.1 技术选型 2.2 设计数据库结构 2.2.1 数据库实体 1. 数据库设计 1.1 数据库名: forum db 1.2 表的设计 1.3 编写SQL 2.系统设计 2.1 技术选型 2.2 设计数据库结构 2.2.1 数据库实体 通过需求分析获得概念类并结合业务实现过程中的技术需要&#x…...

Qt的学习(一)
1.什么是Qt Qt特指用来进行桌面应用开发(电脑上写的程序)涉及到的一套技术Qt无法开发网页前端,也不能开发移动应用。 客户端开发的重要任务:编写和用户交互的界面。一般来说和用户交互的界面,有两种典型风格&…...

EEG-fNIRS联合成像在跨频率耦合研究中的创新应用
摘要 神经影像技术对医学科学产生了深远的影响,推动了许多神经系统疾病研究的进展并改善了其诊断方法。在此背景下,基于神经血管耦合现象的多模态神经影像方法,通过融合各自优势来提供有关大脑皮层神经活动的互补信息。在这里,本研…...