Web前端学习笔记（七）～h、p、i、b、br、hr标签

原创

海轰Pro 2023-01-18 07:03:04 博主文章分类：Web前端 ©著作权

文章标签 web前端学习笔记 vscode html h5 文章分类 运维

©著作权归作者所有：来自51CTO博客作者海轰Pro的原创作品，请联系作者获取转载授权，否则将追究法律责任

DEMO

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>海轰Pro-h1</h1>
    <h2>海轰Pro-h2</h2>
    <h3>海轰Pro-h3</h3>
    <h4>海轰Pro-h4</h4>
    <h5>海轰Pro-h5</h5>
    <h6>海轰Pro-h6</h6>
   
    <i>2020.07.16-i标签：斜体</i>
    <hr>
    <p>嘻嘻嘻</p>
    <p>哈哈哈<br><b>海轰海轰</b></p>
</body>
</html>

效果图

Web前端学习笔记（七）～h、p、i、b、br、hr标签_学习笔记

总结

< h >:标题，分为h1～h6级，h1字体最大，h6最小。非h1～h6，则以正常字体显示
< p >:段落标签
< i >: 使得字体倾斜
< b >:文字加粗
< br>:换行标记
< hr >:水平线
&nbsp ; 表示空格（注：nbsp后面紧跟英文分号）

vscode之html编写快捷方式

1、html模版：先输入！，再按下回车
注意：！是英文感叹号

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

2、单行快速注释：command+/ （或ctrl+/）注：光标在哪一行，按下此快捷键，该行就会被注释掉

Web前端学习笔记（七）～h、p、i、b、br、hr标签_学习笔记_02