HTML 基础【快速掌握知识点】

news2024/12/27 13:01:06

目录

一、什么是HTML?

二、HTML的发展史

三、HTML5的优势

四、HTML基本结构

五、DOCTYPE声明

六、title标签

七、meta标签

八、标题标签

九、段落标签

十、换行标签

十一、水平线标签

十二、字体样式标签

十三、特殊符号

十四、图像标签

十五、链接标签

十六、锚链接

1、创建跳转标记

2、创建跳转链接

十七、邮件链接

十八、行内元素和块元素

块元素

行内元素


一、什么是HTML?

HTML是超文本标记语言,超文本标记语言包括文字、图片、音频、视频、动画等。

二、HTML的发展史

三、HTML5的优势

世界知名浏览器厂商对HTML5的支持、微软、Google、苹果、市场的需求等

四、HTML基本结构

<html>
  <!--网页头部-->
  <head>
    <title>我的第一个网页</title>
  </head>
  <!--主体部分-->
  <body>
    我的第一个网页
  </body>
</html>

五、DOCTYPE声明

<!DOCTYPE html>
<!--html告诉浏览器使用什么规范-->
<html>
<head lang="en">
    <meta charset="utf-8"/>
    <title>新建标签页</title>
</head>
<body>

</body>
</html>

六、title标签

七、meta标签

utf-8 则包含全世界所有国家需要用到的字符,页面编码应与页面文件保存时的编码一致

八、标题标签

<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>

九、段落标签

<p>有勇气就会有奇迹</p>

十、换行标签

<p>
    有勇气!<br/>有奇迹!<br/>....
</p>

十一、水平线标签

<p>
    有勇气!<br/><hr/>有奇迹!<br/><hr/>....
</p>

十二、字体样式标签

加粗:<strong>…</strong>

斜体:<em>…</em>

<p>
    <strong><em>有勇气,有奇迹!</em></strong>
</p>

十三、特殊符号

特殊符号

字符实体

示例

空格

百度 新浪

大于号(>)

>

如果时间>晚上6点,就坐车回家

小于号(<)

<

如果时间<早上7点,就走路去上学

引号(")

"

HTML的属性值必须用成对的"引起来

版权符号@

©

© 百度

十四、图像标签

常见的图像格式:JPG、GIF、PNG、BMP

<img src="path" alt="text" title="text"  width="x"  height="y" />

十五、链接标签

<a href="path" target="目标窗口位置">链接文本或图像</a>

十六、锚链接

从A页面的甲位置跳转到本页中的乙位置

从A页面的甲位置跳转到B页面中的乙位置

1、创建跳转标记

<a name="marker">乙位置</a>

2、创建跳转链接

<a href="#marker">甲位置</a>

十七、邮件链接

<a href="mailto:.....@gmail.com">联系我们</a>

十八、行内元素和块元素

块元素

无论内容多少,该元素独占一行(p、h1-h6…)

行内元素

内容撑开宽度,左右都是行内元素的可以排在一行(a、strong、em…)

 

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

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

相关文章

JavaScript 进阶--charater3

文章目录前言一、编程思想1.1 面向过程介绍1.2 面向对象编程 (oop)对比二、构造函数三、原型3.1原型3.2 constructor 属性3.3 对象原型3.4 原型继承3.5 原型链总结前言 &#x1f191;学习目标 理解面向对象思想&#xff0c;掌握函数原型对象运用面向对象封装继承特点&#xf…

腾讯开源的 hel 提供了加载远程模块的能力,谈谈它的实现原理

腾讯开源的 hel&#xff0c;提供了一种运行时引入远程模块的能力&#xff0c;模块部署在 CDN&#xff0c;远程模块发布后&#xff0c;不需要重新构建发布&#xff0c;就能生效。 个人觉得它的实现原理非常的不错&#xff0c;因此分享给大家。 远程模块可以作为微模块&#xf…

Jenkins利用docker部署vue项目

Jenkins利用docker部署vue项目一、环境准备1、安装docker2、安装nodejs3、安装cnpm与配置淘宝镜像4、jenkins安装nodejs插件二、jenkins以vue项目1、全局参数配置2、源码配置3、构建环境4、构建三、构建项目四、访问一、环境准备 本次jenkins与部署vue项目在同一台机器&#x…

RocketMQ5.0.0的Broker主从同步机制

目录 一、主从同步工作原理 1. 主从配置 2. 启动HA 二、主从同步实现机制 1. 从Broker发送连接事件 2. 主Broker接收连接事件 3. 从Broker反馈复制进度 4. ReadSocketService线程读取从Broker复制进度 5. WriteSocketService传输同步消息 6. GroupTransferService线程…

【每日一题Day127】LC1238循环码排列 | 格雷码构造 位运算

格雷码 看到题目就想到了格雷码 然后就疯狂搜索格雷码 手动构造了一波格雷码 看了题解 emmm 有点亏 理论基础 n 位格雷码序列 是一个由 2n 个整数组成的序列&#xff0c;其中&#xff1a; 每个整数都在范围 [0, 2n - 1] 内&#xff08;含 0 和 2n - 1&#xff09;第一个整数是…

深度学习之“制作自定义数据”--torch.utils.data.DataLoader重写构造方法。

深度学习之“制作自定义数据”–torch.utils.data.DataLoader重写构造方法。 前言&#xff1a; ​ 本文讲述重写torch.utils.data.DataLoader类的构造方法&#xff0c;对自定义图片制作类似MNIST数据集格式&#xff08;image, label&#xff09;&#xff0c;用于自己的Pytorc…

大数据Hadoop教程-学习笔记04【数据仓库基础与Apache Hive入门】

视频教程&#xff1a;哔哩哔哩网站&#xff1a;黑马大数据Hadoop入门视频教程 总时长&#xff1a;14:22:04教程资源: https://pan.baidu.com/s/1WYgyI3KgbzKzFD639lA-_g 提取码: 6666【P001-P017】大数据Hadoop教程-学习笔记01【大数据导论与Linux基础】【17p】【P018-P037】大…

Spring boot开启定时任务的三种方式(内含源代码+sql文件)

Spring boot开启定时任务的三种方式&#xff08;内含源代码sql文件&#xff09; 源代码sql文件下载链接地址&#xff1a;https://download.csdn.net/download/weixin_46411355/87486580 目录Spring boot开启定时任务的三种方式&#xff08;内含源代码sql文件&#xff09;源代码…

【无人机】回波状态网络(ESN)在固定翼无人机非线性控制中的应用(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

前端常见手写面试题集锦

实现迭代器生成函数 我们说迭代器对象全凭迭代器生成函数帮我们生成。在ES6中&#xff0c;实现一个迭代器生成函数并不是什么难事儿&#xff0c;因为ES6早帮我们考虑好了全套的解决方案&#xff0c;内置了贴心的 生成器 &#xff08;Generator&#xff09;供我们使用&#xff…

java面试题-IO流

基础IO1.如何从数据传输方式理解IO流&#xff1f;IO流根据处理数据的类型可以分为字节流和字符流。字节流字节流以字节&#xff08;8位&#xff09;为单位读写数据。字节流主要用于读写二进制文件&#xff0c;如图片、音频、视频等。Java中的InputStream和OutputStream就是字节…

写论文不用构建语料库!只需要福昕PDF阅读器高级搜索

写论文不用构建语料库&#xff01;只需要福昕PDF阅读器高级搜索 文章目录写论文不用构建语料库&#xff01;只需要福昕PDF阅读器高级搜索前言&#xff1a;“福昕语料库”使用前的准备&#xff1a;调用“语料库”&#xff1a;前言&#xff1a; 最近论文阅读可以借助NewBing的总…

【算法与数据结构(C语言)】栈和队列

文章目录 目录 前言 一、栈 1.栈的概念及结构 2.栈的实现 入栈 出栈 获取栈顶元素 获取栈中有效元素个数 检测栈是否为空&#xff0c;如果为空返回非零结果&#xff0c;如果不为空返回0 销毁栈 二、队列 1.队列的概念及结构 2.队列的实现 初始化队列 队尾入队列 队头出队列 获…

报表开发难上手?这里有一份 Fastreport 最新中文用户指南,请查收

Fast Reports,Inc.成立于1998年&#xff0c;多年来一直致力于开发快速报表软件&#xff0c;包括应用程序、库和插件。FastReport的报表生成器&#xff08;VCL平台和.NET平台&#xff09;、跨平台的多语言脚本引擎FastScript、桌面OLAP FastCube&#xff0c;如今都受到世界各地开…

Typecho COS插件实现网站静态资源存储到COS,降低本地存储负载

Typecho 简介Typecho 是一个简单、强大的轻量级开源博客平台&#xff0c;用于建立个人独立博客。它具有高效的性能&#xff0c;支持多种文件格式&#xff0c;并具有对设备的响应式适配功能。Typecho 相对于其他 CMS 还有一些特殊优势&#xff1a;包括可扩展性、不同数据库之间的…

IDA 实战--(2)熟悉工具

布局介绍 软件启动后会 有几个选项&#xff0c;一般直接选择Go 即可 之后的工作台布局如下 开始分析 分析的第一个&#xff0c;将PE 文件拖入工作区 刚开始接触&#xff0c;我们先保持默认选项&#xff0c;其它选项后面会详细讲解&#xff0c;点击OK 后&#xff0c;等待分析…

软件项目管理知识回顾---软件项目质量和资源管理

软件项目质量和资源管理 5.0质量管理 5.1质量管理模型 1.模型 boehm模型&#xff1a;可移植性&#xff0c;可使用性&#xff0c;可维护性McCall模型ISO体系认证5.2质量成本 1.含义&#xff1a;由于产品第一次不正常运行而产生的附加费用 预防成本和缺陷成本5.3质量管理 1.过程 …

Python opencv进行矩形识别

Python opencv进行矩形识别 图像识别中,圆形和矩形识别是最常用的两种,上一篇讲解了圆形识别,本例讲解矩形识别,最后的结果是可以识别出圆心,4个顶点,如下图: 左边是原始图像,右边是识别结果,在我i5 10400的CPU上,执行时间不到8ms。 识别出结果后,计算任意3个顶点…

【自监督论文阅读笔记】Unsupervised Learning of Dense Visual Representations

Abstract 对比自监督学习已成为无监督视觉表示学习的一种有前途的方法。通常&#xff0c;这些方法学习全局&#xff08;图像级&#xff09;表示&#xff0c;这些表示对于同一图像的不同视图&#xff08;即数据增强的组合&#xff09;是不变的。然而&#xff0c;许多视觉理解任务…

PDF文件怎么转图片格式?转换有技巧

PDF文件有时为了更美观或者更直观的展现出效果&#xff0c;我们会把它转成图片格式&#xff0c;这样不论是归档总结还是存储起来都会更为高效。有没有合适的转换方法呢&#xff1f;这就来给你们罗列几种我个人用过体验还算不错的方式&#xff0c;大家可以拿来参考一下哈。1.用电…