html基础介绍

概念

HTML 文件

  1. 扩展名是 .html 的文件称为网页文件或者HTML文件
  2. HTML 文件使用代码编辑进行编辑,使用浏览器查看效果

声明方式

<!Doctype html>

!DOCTYPE 是一个文档类型标记,是一种标准通用标记语言的文档类型声明,在 web 设计中用来说明你用的 XHTML 或者 HTML 是什么版本。

页面的基本结构

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>标题</title></head><body></body>
</html>

标签(元素)

  • 标签分为双标签和单标签
    双标签由开始标签和结束标签组成,结束标签需要 /
    单标签,标准中也有 /
  • 标签具有语义,语义决定什么时候使用该标签
  • 标签名不区分大小写
<div>内容</div>
<img />

属性

标签的属性,由属性名和属性值组成,属性值使用单引号或双引号包裹

同名的属性不能设置多次,如果设置后面的属性不会生效
属性不区分大小写

<img  src=“” style=""/>

主体结构元素说明

标签名语义和功能属性单标签还是双标签
html根元素双标签
head双标签
body主体双标签

HEAD 中的标签

标签名语义和功能属性单标签还是双标签
meta设置页面元信息charset: 设置字符集编码,值推荐 utf-8单标签
title标题栏标题双标签

注释

1、对代码解释说明
2、暂时不想执行的代码可以注释掉

语法

// 单行注释<!-- 多行注释的内容-->

常见的标签

a 标签

<a>  标签用于定义超链接,作用是从一个页面链接到另一个页面。
<a> 标签最重要的属性是 href 属性,用于创建指向另外一个文档的链接(或超链接)

br标签

<br> 标签是空标签,可插入一个简单的换行符。

button标签

<button> 标签用来设置 HTML 中的按钮。
<button type="button">我是按钮</button>

form标签

<form> 标签可以向服务器传输数据,成为表单标签

<h1 – h6> 标签

<h1> - <h6> 标签用来定义 HTML 标题,表示了 HTML 网页中六个级别的标题

img 标签

<img> 标签用于展示 HTML 页面中的图像

还有很多,你可以去w3cschool 上去浏览。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/797355.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

2024.4.6-day11-CSS 背景和精灵图

个人主页&#xff1a;学习前端的小z 个人专栏&#xff1a;HTML5和CSS3悦读 本专栏旨在分享记录每日学习的前端知识和学习笔记的归纳总结&#xff0c;欢迎大家在评论区交流讨论&#xff01; 文章目录 作业2024.4.6学习笔记1 背景2 背景图片3 CSS 精灵图 作业 <!DOCTYPE html&…

项目中 使用 spring cache redis 出现大量keys* 慢查询排查以及修复

前言 业务反馈 redis里有大量的慢查询 而且全是keys 的命令 排查 首先登录 阿里云查看redis的慢查询日志 如下 主要使用到redis cache的注解功能 分别是 CacheEvict 和 Cacheable 注意 CacheEvict 这个比较特殊 会进行驱逐缓存 说白就会删除缓存或者让缓存失效 第一时间想…

第十四届蓝桥杯省赛大学C组(C/C++)填充

原题链接&#xff1a;填充 有一个长度为 n 的 01 串&#xff0c;其中有一些位置标记为 ?&#xff0c;这些位置上可以任意填充 0 或者 1&#xff0c;请问如何填充这些位置使得这个 01 串中出现互不重叠的 0 和 1 子串最多&#xff0c;输出子串个数。 输入格式 输入一行包含一…

golang 数组和切片

区别 1.数组长度固定&#xff0c;切片长度可变 2.数组是深拷贝&#xff0c;切片是浅拷贝&#xff0c;切片是引用类型 扩容规则 不同版本不一样 https://www.jb51.net/article/280481.htm#_lab2_2_1 go1.18 1.如果期望容量大于当前容量的两倍就会使用期望容量&#xff1b; 2.如…

【保姆级教程】如何在 Windows 上实现和 Linux 子系统的端口映射

写在前面 上次分享【保姆级教程】Windows上安装Linux子系统&#xff0c;搞台虚拟机玩玩&#xff0c;向大家介绍了什么是虚拟机以及如何在Windows上安装Linux虚拟机。对于开发同学而言&#xff0c;经常遇到的一个问题是&#xff1a;很多情况下代码开发需要依赖 Linux 系统&…

基于单片机的风向风速传感器防冻装置设计

摘 要:高海拔地区冬季由于冻雨常会造成风向风速传感器被冻结,导致探测数据的缺测。基 于单片机的强大功能,文章设计制作了一种可对风向风速进行自动加热的防冻装置,整个装置 以单片机为核心控制器,主要包括单片机控制电路、继电器驱动电路、温度采集电路,电热丝控 制电路…

多线程代码设计模式之单例模式

目录 设计模式引入 饿汉模式 懒汉模式 单例模式总结 设计模式引入 1.1.什么是设计模式 &#xff08;1&#xff09;设计模式就是一种代码的套用模板。例如&#xff1a;一类题型的步骤分别有哪些&#xff0c;是可以直接套用的。 &#xff08;2&#xff09;像棋谱&#xff…

代码随想录算法训练营DAY17|C++二叉树Part.4|110.平衡二叉树、257.二叉树的所有路径、404.左叶子之和

文章目录 110.平衡二叉树思路伪代码CPP代码 257.二叉树的所有路径思路伪代码实现CPP代码 404.左叶子之和思路伪代码CPP代码 110.平衡二叉树 力扣题目链接 文章讲解&#xff1a;110.平衡二叉树 视频讲解&#xff1a;后序遍历求高度&#xff0c;高度判断是否平衡 | LeetCode&…

后端返回二进制,前段导出excel

axios({method: post,url: URL,responseType: blob,}).then(async res > {let blob new Blob([res.data], { type: application/vnd.ms-excel;charsetutf-8 });let href window.URL.createObjectURL(blob); //创建下载的链接const link document.createElement(a);link.h…

lua学习笔记6(经典问题输出99乘法表)

print("************for循环的99乘法表*************") for i 1, 9 dolocal line "" -- 创建一个局部变量来累积每行的输出--local 是一个关键字&#xff0c;用于声明一个局部变量。for j 1, i doline line .. j .. "*" .. i .. ""…

电脑桌面上表格不见了怎么找回?这5个方法不要错过

在日常的办公和学习中&#xff0c;电脑桌面上的各种文件、文件夹和表格等无疑是我们较为频繁使用的资源。然而&#xff0c;有时我们可能会因为一些操作失误或者电脑问题&#xff0c;突然发现桌面上的某个表格文件神秘失踪了。面对这种情况&#xff0c;很多人可能会感到焦虑和不…

[WIP]Sora相关工作汇总VQGAN、MAGVIT、VideoPoet

视觉任务相对语言任务种类较多(detection, grounding, etc.)、粒度不同 (object-level, patch-level, pixel-level, etc.)&#xff0c;且部分任务差异较大&#xff0c;利用Tokenizer核心则为如何把其他模态映射到language space&#xff0c;并能让语言模型更好理解不同的视觉任…

Python-VBA函数基础知识-001

一、函数的定义&#xff1a; 函数(Function)是一段可重复使用的代码块&#xff0c;用于执行特定的任务或计算&#xff0c;并可以接受输入参数和返回输出结果。函数可以将复杂的问题分解为更小的子问题&#xff0c;提高代码的可读性和可维护性。 二、函数的组成&#xff1a; 在…

Spring Boot集成JWT快速入门demo

1.JWT是什么&#xff1f; JWT&#xff0c;英文全称JSON Web Token&#xff1a;JSON网络令牌。为了在网络应用环境间传递声明而制定的一种基于JSON的开放标准(RFC 7519)。这个规范允许我们使用JWT在客户端和服务端之间传递安全可靠的信息。JWT是一个轻便的安全跨平台传输格式&am…

前端零基础学习web3开发

目录 1 钱包 2 发起交易 3 出块 4 块高 5 矿工 6 Gas费 这一节&#xff0c;我们不说让人神往的比特币&#xff0c;不说自己会不会利用这个虚拟的货币来发财&#xff0c;也不说那些模模糊糊的知识&#xff0c;什么去中心化啦&#xff0c;什么奇妙的加密啦&#xff0c;我们…

《青少年成长管理2024》024 “成长七要素之四:知识”1/4

《青少年成长管理2024》024 “成长七要素之四&#xff1a;知识”1/4 一、什么是知识二、知识的分类&#xff08;一&#xff09;知识按学科进行分类&#xff08;二&#xff09;知识按用途进行分类&#xff08;三&#xff09;知识按照和职业的关系进行分类&#xff08;四&#xf…

AI 驱动强大是视频转换处理软件

由 AI 驱动的视频工具包。 增强、转换、录制和编辑视频AI 驱动的顶级视频工具包。 不论是老旧、低质、噪声或模糊的影片/图像&#xff0c;都能升级至 4K&#xff0c;稳定抖动的影片&#xff0c;提升帧率至 120/240fps&#xff0c;并能以全面 GPU 加速进行转换、压缩、录制和编辑…

盘点那些好用的SAP FIORI App (四)-应收账期报告

这个App的ID是IDCNAR, 其实也是一个T-Code, 也就是说&#xff0c;不光在FIORI app里面可以使用&#xff0c;在SAP GUI里面也是存在的&#xff0c;这个就属于我另一篇里面提到的&#xff0c;GUI和FIORI都可以使用的功能&#xff0c;但是前提是S4 HANA平台 操作的界面非常简单&am…

LightGBM。决策树算法。直方图的算法。

目录 LightGBM。 决策树算法。 直方图的算法。 推荐系统可以根据用户挖掘有价值的信息偏好,因此它被广泛应用于各个行业。但是,推荐系统的性能通常受到数据稀疏性问题的影响,并且LightGBM可以在一定程度上缓解数据稀疏性带来的影响。 为此,提出了一种基于LightGBM和dee…

linux进阶篇:磁盘管理(一):LVM逻辑卷基本概念及LVM的工作原理

Linux磁盘管理(一)&#xff1a;LVM逻辑卷基本概念及LVM的工作原理 一、传统的磁盘管理 在传统的磁盘管理方案中&#xff0c;如果我们的磁盘容量不够了&#xff0c;那这个时候应该要加一块硬盘&#xff0c;但是新增加的硬盘是作为独立的文件系统存在的&#xff0c;原有的文件系…