前端笔记HTML

毓笙灵曦

已于 2022-07-05 19:31:36 修改

阅读量169

点赞数

文章标签：前端 html

于 2022-07-02 19:55:59 首次发布

本文链接：https://blog.csdn.net/m0_59649050/article/details/125576417

版权

1.HTML的基本语法

常规标记也叫双标记

<标记></标记>
<标记 属性=“属性值”></标记>
标记也可以叫标签或元素

空标记也叫单标记

<标记/>
<标记 属性=“属性值”/>
如<br/>

举例：我的第一个网页

<html>
    <head>
        <title>我的第一个网页</title>
        <body>
            <center>
                我要在岸上<br/>加油
            </center>//居中
        </body>
    </head>
</html>

2.文档声明与字符编码

<!DOCTYPE html>
<html lang="en">  //代表语言是英文，zh-CN代表中文，ja-jp代表日文
<head>
    <meta charset="UTF-8"> //字符编码
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>2</title>
</head>
<body>
    
</body>
</html>

3.HTML常用标签

<!--1.文本标题 -->
    <h1>1</h1>
    <h2>2</h2>
    <h3>3</h3>   
    <!-- 文本标题标签自带加粗，有自己的文本大小并自占一行，有默认间距 -->

    <!--2.段落文本 -->
    <p>段落文本内容</p>
    <!-- 标识一个段落（段落与段落之间有段间距） -->

    <!--3.换行 -->
    <br/>
    <!--4.换行是一个空标记（强制换行） -->

    <!--5.水平线 -->
    <hr/>空标记

    <!-- 6.加粗  strong -->
    <b>加粗内容</b> 只是显示加粗
    <strong>强调的内容</strong>突出的文本

    <!-- 7.倾斜   em-->
    <em>强调文本</em>
    <i>倾斜文本</i>

    <!-- 8.删除线  del-->
    <s>文本</s>
    <del>文本</del>

    <!-- 9.扩展 -->
    <u>文本</u>下划线
    <sub></sub>下标
    <sup></sup>上标

4.百科词条案例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>HTML5</h1>
    <p>本词条由<strong>“科普中国”科学百科词条编写与应用工作项目</strong>审核。</p>
    <p> HTML5是构建 Web 内容的一种语言描述方式。
    HTML5是互联网的下代标准，<strong>是构建以及呈现互联网内容的一种语言方式</strong>被认为是互联网的核心技术之一．
    HTML 产生于1990年，1997年HTML4成为互联网标准，并广泛应用于互联网应用的开发</p>
    <p>HTML5是 Web 中核心语言 HTML 的规范，用户使用任何手段进行网页浏此时看到的内容原本都是 HTML 格式的，
        在浏览器中过一些技术处理将其转換成为了可识别的信息。
        HTML5在从前<del>HTML4.01</del>的基础上进行了一定的改进，虽然技术人员在开发
    过程中可能不会将这些新技术投入应用，但是对于该种技术的新特性，网站开发技术人员是必须要有所了解的。<sub>[1-2]</sub></p>
    
    <h2>Html5的新特性</h2>
    <p>HTML5将 Web 带入一个成熟的应用平台，在这个平台上，<strong>视频、音频、图像、动画以及与设备</strong>的交互都进行了规范。</p>
    
    <h3>智能表单</h3>
    表单是实现用户与页面后台交互主要组成部分，HTML5在表单的设计上功能更加强大。 
    <h4>多媒体</h4>
    <p>H