HTML入门基础(1)

Litheng

已于 2023-03-20 11:37:24 修改

阅读量92

点赞数 1

分类专栏： HTML 文章标签： html5

于 2022-12-12 14:43:52 首次发布

本文链接：https://blog.csdn.net/Litheng/article/details/128285427

版权

HTML 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

HTML基础格式：

在vscode里面新建文件输入!基础格式快捷键

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>我是一个合法网页</title>
    </head>
    <body>
        <h1>HTML，梦开始的地方！！</h1>
    </body>
</html>

HTML标题段落标签

1、h1-h6标题标签，双标签，基本语法为<h1>文字内容</h1>，表示不同大小的段落标题，h1最大，h6最小

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>标题标签</title>
    </head> 
    <body>
        <h1>一级标题</h1>
        <h2>二级标签</h2>
        <h3>三级标签</h3>
        <h4>四级标签</h4>
        <h5>五级标签</h5>
        <h6>六级标签</h6>
    </body>
</html>

效果如下：

align属性，基本语法为<h1 align="center">文本内容</h1>，表示内容居中显示

2、p正文标签，双标签，用来定义文章的段落，基本语法为<p>文本内容</p>，里面是正文的内容

<!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="UTF-8">
            <title>段落标签</title>
        </head>
        <body>
            <p>
                HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。
            </p>
        </body>
    </html>

效果如下：

可以看到，p标签里的文本在浏览器中显示出来。那么如何将p标签里面的文字首行缩进两字符呢？

用&emsp;、 来实现此效果，一个&emsp;代表一个空格，两个 代表一个空格

<!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="UTF-8">
            <title>段落标签</title>
        </head>
        <body>
            <p>
                &emsp;&emsp;HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。
            </p>
        </body>
    </html>

<!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="UTF-8">
            <title>段落标签</title>
        </head>
        <body>
            <p>
                &nbsp;&nbsp;&nbsp;&nbsp;HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。
            </p>
        </body>
    </html>

效果如下：