HTML

HTML

HTML是用来描述网页的一种语言。

  • HTML指的是超文本标记语言：HyperText MarupLanguage

  • HTML不是一种编程语言，而是一种标记语言

  • 标记语言是一套标记标签

  • HTML使用标记标签来描述网页

  • HTML文档包含了HTML标签及文本内容

  • HTML文档也叫做web页面

 <!DOCTYPE html> <!--声明为HTML文档，不区分大小写-->
 <html>  <!--HTML页面的根元素-->
 <head>  <!--元素包含了文档的元（meta）数据，如<meta charset="utf-8">定义网页编码格式为utf-8。对于中文网页需要使用<meta charset="utf-8">声明，否则会出现乱码。有些网站需要设置为<meta charset="gbk">-->
 <meta charset="utf-8">
 <title>菜里菜气蔡某（www.cnblogs.com/zt-16/）</title> <!--描述了文档的标题-->
 </head> 
   <body>  <!--包含了可见的页面内容-->
     <h1>  <!--定义一个大标题-->
       标题
     </h1>
     <p> <!--定义一个段落-->
       段落
     </p>
   </body>
 </html>

HTML文档的后缀名：.html或者.htm。

HTML标签（元素）

  • HTML标签是由尖括号包围的关键词，如<html>

  • HTML标签通常是成对出现的，如<p>和</p>

  • 标签对中第一个标签是开始（开放）标签，第二个标签是结束（闭合）标签

  • 某些HTML元素具有空内容。

  • 空元素在开始标签中进行关闭。如 。

HTML链接

 <a href="https://www.cnblogs.com/zt-16/">这是一个链接</a>
 <!--在href属性中指定连接的地址-->

target属性

使用target属性，可以定义被链接的文档在何处显示。

 <a href="https://www.cnblogs.com/zt-16/" target="_blank" rel="noopener noreferrer">访问我的博客</a> <!--将target属性设置为_blank，链接将在新窗口打开-->

id属性

 <a id="tips">有用的提示部分</a>  <!--在HTML文档中插入id-->
 <a id="#tips">访问有用的提示部分</a> <!--在HTML文档中创建一个链接到“有用的提示部分”-->
 <a href="https://www.cnblogs.com/zt-16#tips">访问有用的提示部分</a>  <!--从另一个页面创建一个链接到“有用的提示部分”-->

 

HTML图像

 <img loading="lazy" src="/images/logo.png" width="258" height="39">

HTML标题

 <h1>-<h6>

HTML水平线

 <hr>  <!--创建水平线，分割内容-->

HTML注释

 <!--注释-->

HTML折行

 <br>  <!--换行-->

当显示页面时，浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被算作一个空格。

HTML格式化标签

标签描述
<b> 定义粗体文字
<em> 定义着重文字
<i> 定义斜体字
<small> 定义小号字
<strong> 定义加重语气
<sub> 定义下标字
<sup> 定义上标字
<ins> 定义插入字
<del> 定义删除字

HTML头部

标签描述
<head> 包含了所有的头部标签元素。可以添加在头部区域的元素标签为：<title>,<style>,<meta>,<link>,<noscript>,<base>。
<title> 在HTML文档中是必须的。定义了浏览器工具栏的标题；当网页添加到收藏夹时，显示在收藏夹当中的标题；显示在收藏引擎结果页面的标题。
<base> 描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接。
<link> 定义了文档与外部资源之间的关系。通常用于链接到样式表。
<meta> 描述了一些基本的元数据。文件最后的修改时间，作者和其他元数据。
<script> 定义了客户端的脚本文件。
<style> 定义了HTML文档中的样式文件。

HTML图像

<img>是空标签，只包含属性，并且没有闭合标签。

 <img src="url" alt="some_text" width=" " height=" ">
 <!--src（源属性）指“source”，源属性的值是图像的url地址-->
 <!--alt属性：为图像定义一串预备的可替换的文本-->

HTML表格

表格由<table>标签来定义。每个表格均有若干行（<tr>），每行被分割为若干单元格（<td>）。

 <table border="1"><!--边框属性-->
   <tr>
   <th>表头</th>
   </tr>
   <tr>
     <td>单元格1</td>
     <td>单元格2</td>
   </tr>
   <tr>
     <th>表头1</th>
     <th colspan="2">表头2</th><!--单元横跨两列-->
   </tr>
   <tr>
     <th rowspan="2">表头</th><!--单元横跨两行-->
   </tr>
 </table>

HTML列表

标签描述
<ol> 定义有序列表
<ul> 定义无序列表
<li> 定义列表项
<dl> 定义列表
<dt> 自定义列表项目
<dd> 定义自定列表项的描述

HTML属性

  • HTML元素可以设置属性

  • 属性可以在元素中添加附加信息

  • 属性一般描述于开始标签

  • 属性值应该始终被包括在引号内。当属性值本身就含有双引号，则必须使用单引号。

HTML表单

表单是一个包含表单元素的区域。

表单元素允许用户在表单中输入内容。

表单标签：<form> </form>。

HTML框架

 <iframe src="url"></iframe>
 <iframe src="url" width="" height=""></iframe><!--设置高度与宽度-->
 <iframe src="url" frameborder="0"></iframe><!--移除边框-->
 <iframe src="url" name="a"></iframe>
 <p>
   <a href="" target="a" rel=""></a>
 </p>
 <!--显示目标链接页面-->

HTML脚本

标签描述
<script> 定义了客户端脚本
<noscript> 定义了不支持脚本浏览器输出的文本

HTML字符实体

在HTML中，某些字符是预留的。

在HTML中不能使用小于号和大于号，会被浏览器误认为标签。

如果希望正确的显示预留字符，必须在HTML源代码中使用字符实体。

posted @ 2021-10-05 08:55  菜里菜气菜某  Views(139)  Comments(0)    收藏  举报