自学web前端开发1（HTML）

雨忱在敲代码

已于 2024-03-06 22:45:23 修改

阅读量349

点赞数 10

文章标签：前端

于 2024-03-02 00:56:10 首次发布

本文链接：https://blog.csdn.net/YuChen__c/article/details/136408354

版权

本文介绍了前端程序员的基础认知，包括HTML的概念、语法规范，如标签的构成、父子与兄弟关系，以及标题标签的学习。通过理解这些内容，读者将对HTML的基石有深入认识。

摘要由CSDN通过智能技术生成

一、基础认知

1.1基础知识

前端程序员的代码经过浏览器的渲染引擎进行解析渲染获得相应的页面，不同浏览器的渲染引擎不停，导致相同代码的渲染结果不同，于是就产生了Web标准，包括HTML/CSS/JavaScript,分别用2于控制页面元素和内容、网站的外观和样式、网站与用户的交互。

1.2HTML概念

1.2.1HTML（Hyper Text Mark Language）超文本标记语言

直接创建文本文档修改后缀为html即可建立一个html文档

<strong>字体加粗</strong>

HTML的标签式标记语言，通过< >与</ >进行编辑

1.2.2HTML的网页固定结构

<html>
 <head>
  <title>标题</title>
 </head>
 <body>
  网页内容
 </body>
</html>

这是HTML的骨架结构

1.3HTML语法规范

1.3.1使用VScode的快捷建立

！

直接在新的html文件中敲出！后回车即可自动生成

以及输入head等+回车可以自动生成相应格式

Ctrl+s 快捷保存

Ctrl+d 多选

<!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>

1.3.2注释

    <!--直接使用快捷键Ctrl+/进行注释  -->

1.3.3HTML标签的构成

<strong>加粗</strong>
开始标签+包裹内容+结束标签（双标签）

少数标签由一部分组成，为单标签，如换行<br>

1.3.4标签之间的关系

父子关系（嵌套关系），如

<head>
 <title></title>
</head>

兄弟关系（并列关系），如

<head></head>
<body></body>

二、HTML标签学习

2.1标题标签

<h1>一级标题</h1>
<h2>一级标题</h2>
<h3>一级标题</h3>
<h4>一级标题</h4>
<h5>一级标题</h5>
<h6>一级标题</h6>

有且只有六个，独占一行，逐个减小

雨忱在敲代码

关注

10
点赞
踩
8

收藏

觉得还不错? 一键收藏
0
评论
自学web前端开发1（HTML）

对HTML的基础认知，标题标签
复制链接

扫一扫