HTML 全部基础

最新推荐文章于 2024-05-06 10:59:29 发布

Back to the original

最新推荐文章于 2024-05-06 10:59:29 发布

阅读量42

点赞数 3

分类专栏： wed 前端文章标签： html css 前端

本文链接：https://blog.csdn.net/qq_45150540/article/details/134359656

版权

wed 前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

HTML 简介

HTML（超文本标记语言）是用于创建网页的标准语言。它使用标记来定义文档的结构和呈现。HTML 允许你创建网页，设置格式，添加图像、音频和视频，以及创建交互式组件，如表单和按钮。

HTML 基本结构

一个简单的 HTML 文档包含在 <!DOCTYPE html> 声明之后的 <html> 标签中。<html> 标签是文档的根元素，所有其他元素都包含在它里面。

<!DOCTYPE html>
<html>
  <head>
    <title>页面标题</title>
  </head>
  <body>
    页面内容
  </body>
</html>

<head> 元素包含了文档的元数据，如标题、样式和脚本。
<title> 元素定义了浏览器标签栏上显示的标题。
<body> 元素包含了文档的内容，如文本、图像、视频等。

HTML 标签

HTML 标签是用尖括号包裹的单词或字母组合，例如 <html>。标签可以用于创建各种不同的元素和结构。
以下是一个 HTML 标签列表，包括常见的标签和它们的作用：

<html>：定义整个 HTML 文档的根元素。
<head>：定义文档的头部信息，如标题、样式和脚本等。
<title>：定义文档的标题，显示在浏览器的标题栏或标签页上。
<body>：定义文档的主体内容，如文本、图像、视频等。
<h1> 到 <h6>：定义六个级别的标题，<h1> 表示最高级别（最重要），<h6> 表示最低级别（最不重要）。
<p>：定义段落。
<a>：定义超链接，用于链接到其他页面或文档。
<img>：定义图像，用于显示图像。
<audio>标签用于在网页中添加音频内容，比如音乐或音频流。它支持三种常见的音频格式：MP3、Wav 和 Ogg。
<video>标签用于在网页上嵌入视频内容，例如电影或视频流。该标签同样支持多种视频格式
<div>：定义一个 division 或 section，用于组织文档内容。
<span>：定义一个 span，用于对文本进行分组和样式化。
<style>：定义样式信息，用于内联样式表。
<script>：定义脚本代码，用于添加交互性和动态效果。
<tr>：定义表格行。
<td>：定义表格单元格。
<th>：定义表格头部单元格。
<ul>：定义无序列表，用于列出项目和子项目。
<ol>：定义有序列表，用于列出项目和子项目，并指定它们的顺序。
<li>：定义列表项。
<form>：定义表单，用于收集用户输入。
<input>：定义输入控件，用于接收用户输入。
<textarea>：定义多行文本输入框。
<button>：定义按钮，用于触发交互事件。
<select>：定义下拉列表，用于列出选项供用户选择。
<option>：定义下拉列表中的选项。
<header>：定义页面或部分的页眉区域，通常包含标题、标志等元素。
<footer>：定义页面或部分的页脚区域，通常包含版权信息、联系方式等元素。

HTML 属性

HTML 属性是用于提供元素更多信息的属性。它们通常包含在标签中，例如 class="..." 或 id="..."。
以下是一个 HTML 属性列表，包括常见的属性和它们的作用：

class：定义元素的类别，用于指定 CSS 类名。
id：定义元素的唯一标识符，用于指定元素的特定样式或脚本。
style：定义元素的行内样式，用于指定元素的样式属性。
src：定义元素的源文件路径，用于指定元素的外部文件。
alt：定义图像的替代文本，用于在图像无法显示时显示文本。
title：定义元素的额外信息，用于在鼠标悬停时显示提示信息。
width和height：定义元素的宽度和高度，用于设置元素的尺寸。
align：定义元素的水平对齐方式，可选值为"left"、“center"和"right”。
valign：定义元素的垂直对齐方式，可选值为"top"、“middle"和"bottom”。
colspan和rowspan：定义单元格的跨列和跨行，用于合并单元格。
colspan和rowspan：定义表格的列数和行数，用于指定表格的大小。
controls：定义是否显示音频或视频控件，如播放、暂停和音量调节等。
loop：定义是否循环播放音频或视频。
muted：定义是否静音音频或视频。
poster：定义视频的封面图像，用于在视频加载时显示图像。
preload：定义视频的预加载选项，可选值为"none"、“metadata"和"auto”。
autoplay：定义是否自动播放音频或视频。
loop：定义是否循环播放音频或视频。
muted：定义是否静音音频或视频。
controls：定义是否显示音频或视频控件，如播放、暂停和音量调节等。

HTML 样式

HTML 样式可以使用CSS内联样式、内部样式表或外部样式表来定义。样式可以帮助你改变元素的外观、位置和大小。

HTML 脚本

HTML 脚本可以使用 JavaScript 来添加交互性和动态效果。你可以使用 <script> 标签来包含脚本。

HTML 实例

下面是一个简单的 HTML 页面示例：

<!DOCTYPE html>
<html>
  <head>
    <title>我的网页</title>
    <style>
      body {
        background-color: #f2f2f2;
      }
      h1   {
        color: blue;
        text-align: center;
      }
      p    {
        font-family: verdana;
        font-size: 20px;
      }
    </style>
  </head>
  <body>
    <h1>欢迎来到我的网页</h1>
    <p>这是一个简单的 HTML 页面示例。</p>
    <p>学习 HTML 并创建自己的网页吧！</p>
    <a href="https://www.mjl.com">访问示例网站</a>
  </body>
</html>