HTML标签语法,基本框架

目录

1.HTML定义

2.标签语法

3.HTML基本骨架

网页模板

(1)快速生成骨架

4.标签的关系

5.注释

a.意义:

b.注释快捷键

6.排版标签-标题和段落

a.标题标签

注:显示特点

经验分享:

b.段落标签

注:显示特点

示例:

7.换行和水平线标签(单标签)

[a.换行:
(单标签)](#a.换行: (单标签))

b.水平线:


(单标签)


1.HTML定义

2.标签语法

(CTRL+S保存文件,先保存后运行)

(1) 标签成对出现,中间包裹内容

(2) <>里面放英文字母(标签名)

(3)结束标签比开始标签多 /

(4)拓展

  • 双标签:成对出现的标签

  • 单标签:只有开始标签,没有结束标签

3.HTML基本骨架

网页模板

  • html: 整个网页
  • head: 网页头部,存放给浏览器看的代码,例如 CSS
  • body: 网页主体,存放给用户看的代码,例如 图片、文字
  • title:网页标题

(1)快速生成骨架

4.标签的关系

(1)作用:明确代码书写位置

(2)关系:

  • 父子关系(嵌套关系)
  • 兄弟关系(并列关系)

5.注释

a.意义:

注释就是对代码的解释和说明,其目的是让人们能够更加轻松地了解代码。注释是编写程序时,写程序的人给一个语句、程序段、函数等的解释或提示,能提高程序代码的可读性。

在编写HTML代码时,我们经常要在一些关键代码旁做一下注释,这样做的好处很多,比如:方便理解、方便查找或方便项目组里的其它程序员了解你的代码,而且可以方便以后你对自己代码进行修改。

b.注释快捷键

6.排版标签-标题和段落

a.标题标签

  1. :最大的标题,通常用于主标题,每个页面应只有一个

    标签。

  2. :次级标题,通常用于章节标题。

  3. :三级标题,通常用于子章节标题。

  4. :更低级别的标题,用于更细分的章节。

注:显示特点

文字加粗 字号逐渐减小 独占一行

经验分享:

- h1 标签在一个网页中只能用一次,用来放新闻标题或网页的 logo

- h2~h6没有使用限制

b.段落标签

段落标签

用于定义文本段落。浏览器会自动在段落的前后添加一些空白行(默认的上下边距),以区分不同的段落。

注:显示特点

  1. 独占一行

    标签是一个块级元素,它会独占一行显示,前后的内容都会被挤到上下行。

  2. 默认样式 :浏览器会为

    标签添加默认的上下边距(通常是 1em)【段落之间存在间隙】

示例:

7.换行和水平线标签(单标签)

a.换行:<br>(单标签)

b.水平线:<hr>(单标签)

相关推荐
2分钟速写快排4 小时前
什么是 RAG?如何用 RAG 实现一个用户记忆?
前端·后端·ai编程
passerby60614 小时前
如何自己造一个时间处理库
前端·javascript·github
走到天涯海角5 小时前
react里面的长列表渲染优化
前端·react.js·前端框架
小羊没烦恼!5 小时前
Hello Web API系列教程——Web API与国际化
java·服务器·前端·javascript·php
北岛贰6 小时前
迷茫焦虑期,我做了一个带支付带官网的 AI 聊天虚拟恋人 App
前端·人工智能·后端
mayaairi7 小时前
Vue2 组件通讯(三):全局事件总线、PubSub、插槽与组件实例属性
前端·javascript·vue.js
kyriewen8 小时前
面试官问我:AI 都能写代码了,前端凭什么还值 25K
前端·javascript·人工智能
风骏时光牛马8 小时前
AI源码分析:拆解模型底层实现逻辑
前端
BillKu8 小时前
全局样式变量:CSS 自定义属性(--border-color)和SCSS 变量($border-color)的说明
javascript·css·scss
IT_陈寒9 小时前
React子组件莫名其妙重渲染?你可能漏了这个Hook
前端·人工智能·后端