HTML语法规范

HTML语法规则

  1. HTML 标签是由尖括号包围的关键词,标签通常是成对出现的,例如 <html></html>,称为双标签 。标签对中的第一个标签是开始标签,第二个标签是结束标签
  2. 单标签比较少,例如<br />,加一个/即可

标签关系

双标签关系可以分为两类:包含关系并列关系

//包含标签:
<html><head></head>
</html>
//并列关系:
<html><head></head><body> </body>
</html>

HTML 基本结构标签

  1. HTML页面也称为 HTML 文档
  2. HTML 文档的的后缀名必须是 .html.htm ,浏览器的作用是读取 HTML 文档,并以网页的形式显示出它们。这也就提醒我们,用记事本时,要修改后缀名。
  3. 此时,用浏览器打开这个网页,可以预览HTML 文件了

在这里插入图片描述

vscode使用技巧

  1. ctrl + / - 放大缩小页面
  2. shift + alt + 下箭头 快速赋值上一行
  3. ctrl + d 选定多个相同的单词,双击单词,再按快捷键,可同时修改多个单词
  4. ctrl + alt + 上箭头/下箭头 ,添加多个光标,同时修改多行
  5. ctrl + h 全局替换某些单词
  6. ctrl + g 快速定位到某一行
  7. shift + alt 然后拖动鼠标,可以选择某个区块进行操作
  8. ctrl + / 单行注释

DOCTYPE

<!DOCTYPE html>  文档类型声明标签,告诉浏览器这个页面采取html5版本来显示页面.

注意:

  1. <!DOCTYPEl> 声明位于文档中最前面的位置,处于<html>标签之前
  2. <!DOCTYPEl>不是一个HTMl标签,他就是文档类型声明标签

HTML常用标签

标题标签

特点:

  1. 加了标题的文字会变的加粗,字号也会依次变大。
  2. 一个标题独占一行
  3. 标题标签为双标签,成对出现<h1></h1>
  4. 重要性h1h6一次递减

段落标签

  1. 需要注意的是,在软件使用时我们人为的换行,在网站打开是不起作用的无论打一个空格还是10个空格,都只会显示一个空格,因此需要段落标签帮助我们进行分段处理
  2. 双标签<p> 我是一个段落标签 </p>
  3. vscode中查看 – 自动换行
  4. 特点:
    1. 文本在一个段落中会根据浏览器窗口的大小自动换行。
    2. 段落和段落之间保有空隙。

换行标签

  1. 在 HTML 中,一个段落中的文字会从左到右依次排列,直到浏览器窗口的右端,然后才自动换行。如果希望某段文本强制换行显示,就需要使用换行标签 <br />
  2. 特点:
    1. <br /> 是个单标签
    2. <br /> 标签只是简单地开始新的一行,跟段落不一样,段落之间会插入一些垂直的间距,
    3. 不会形成如段落一样的较大缝隙,在网页上看就是单纯的另起一行,而不是另起一段

文本格式化标签

在这里插入图片描述

特殊标签

  1. <div><span>标签,是是没有语义的,它们就是一个盒子,用来装内容的。
  2. 特点:
    1. <div> 标签用来布局,但是现在一行只能放一个<div>,也就是说一个<div>占一整行,后面再写内容会在<div>的下面显示。 大盒子
    2. <span> 标签用来布局,一行上可以多个 <span>。小盒子
    3. 都是双标签

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/890256.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

STL 剖析

STL 六大组件 「STL 六大组件的交互关系」 Container 通过 Allocator 取得数据储存空间Algorithm 通过 Iterator 存取 Container 内容Functor 可以协助 Algorithm 完成不同的策略变化Adapter 可以修饰或套接 Functor、Iterator 配置器(allocator) 配置器&#xff1a;负责空间…

Y3编辑器教程8:资源管理器与存档、防作弊设置

文章目录 一、资源管理器简介1.1 界面介绍1.2 资源商店1.3 AI专区1.3.1 AI文生图1.3.2 AI图生图1.3.3 立绘头像 二、导入导出2.1 文件格式2.2 模型导入2.2.1 模型制作后导出2.2.2 模型文件导入Y3编辑器2.2.3 Y3编辑器角色、装饰物模型要求 2.3 纹理导入2.4 材质贴图2.4.1 材质支…

DL作业11 LSTM

习题6-4 推导LSTM网络中参数的梯度&#xff0c; 并分析其避免梯度消失的效果 LSTM&#xff08;长短期记忆网络&#xff09;是一种特殊的循环神经网络&#xff08;RNN&#xff09;&#xff0c;旨在解决普通 RNN 在处理长序列时遇到的梯度消失和梯度爆炸问题。它通过设计多个门…

面试题整理9----谈谈对k8s的理解1

谈谈对k8s的理解 1. Kubernetes 概念 1.1 Kubernetes是什么 Kubernetes 是一个可移植、可扩展的开源平台&#xff0c;用于管理容器化的工作负载和服务&#xff0c;方便进行声明式配置和自动化。Kubernetes 拥有一个庞大且快速增长的生态系统&#xff0c;其服务、支持和工具的…

解决MySQL安装难题:vcruntime140_1.dll文件丢失修复指南

在安装MySQL的过程中&#xff0c;用户可能会遇到一个常见的问题&#xff1a;“找不到vcruntime140_1.dll&#xff0c;无法继续执行代码”。这个错误提示表明系统缺少一个关键的动态链接库文件&#xff0c;这对于运行依赖于它的应用程序至关重要。本文将详细介绍vcruntime140_1.…

【前后端】HTTP网络传输协议

近期更新完毕&#xff0c;建议关注、收藏&#xff01; http请求 URL 严格意义上应该是URI http or https http不加密不安全&#xff1b;https加密协议&#xff08;公网使用&#xff09; http端口号80 https端口号443GET or POST GET和POST是HTTP请求的两种基本方法. 因为POST需…

多线程 - 自旋锁

个人主页&#xff1a;C忠实粉丝 欢迎 点赞&#x1f44d; 收藏✨ 留言✉ 加关注&#x1f493;本文由 C忠实粉丝 原创 多线程 - 自旋锁 收录于专栏[Linux学习] 本专栏旨在分享学习Linux的一点学习笔记&#xff0c;欢迎大家在评论区交流讨论&#x1f48c; 目录 概述 原理 优点与…

thinkphp5验证码captcha无法显示

排查思路 是否开启gd2以及gd2排查bom排查代码清除缓存 开启gd/gd2 找到php.ini 开启dg2库 去掉前面的;注释&#xff0c;有的可能会带.dll后缀影响不大 然后通过生成图片验证是否成功 查看是否存在bom 修改为utf-8即可&#xff0c;如果你的代码携带bom也需要排查一下 代码问…

Flutter组件————FloatingActionButton

FloatingActionButton 是Flutter中的一个组件&#xff0c;通常用于显示一个圆形的按钮&#xff0c;它悬浮在内容之上&#xff0c;旨在吸引用户的注意力&#xff0c;并代表屏幕上的主要动作。这种按钮是Material Design的一部分&#xff0c;通常放置在页面的右下角&#xff0c;但…

#{ }和${ } 、参数处理

目录 #{ }和${ } 参数处理 入参-parameterType 使用Map 使用Bean / List<Bean> 使用多参数 Param注解&#xff08;命名参数&#xff09; 出参-resultType 返回Map / List<Map> 返回Map<String,Map> 属性名不一致-resultMap结果映射 #{ }和${ }…

MySQL数据库——门诊管理系统数据库数据表

门诊系统数据库his 使用图形化工具或SQL语句在简明门诊管理系统数据库his中创建数据表&#xff0c;数据表结构见表2-3-9&#xff5e;表2-3-15所示。 表2-3-9 department&#xff08;科室信息表&#xff09; 字段名称 数据类型 长度 是否为空 说明 dep_ID int 否 科室…

Gin-vue-admin(4):项目创建前端一级页面和二级页面

目录 创建一级页面创建二级页面 创建一级页面 view目录下新建一个my&#xff0c;Index.vue <template></template><script> export default {name:My, } </script><script setup> import {ref} from vue const myNameref("name") &…

ABAP SQL 取日期+时间最新的一条数据

我们在系统对接的时候&#xff0c;外部系统可能会推送多个数据给到我们。 我们 SAP 系统的表数据中日期和时间是作为主键的&#xff0c;那么如果通过 ABAP SQL 取到最新日期的最新时间呢。 解决方案&#xff1a; 方式 1&#xff1a;SELECT MAX 可以通过两个 SELECT MAX 来取…

【面试 - 遇到的问题】Vue 里 router-view 使用 key + 关闭页面后重新打开页面-获取的数据赋值到旧组件问题(钩子执行顺序)

目录 【1】问题描述【2】问题排查前 - 页面渲染、tag 页签渲染 逻辑梳理页面渲染【借用别人的描述】<router-view :key"key" />1. 不设置key 属性2. 设置 key 属性值为 $route.path/page/1 > /page/2/page?id1 > /page?id2, 3. 设置 key 属性值为 $rou…

应该连续学一个科目,还是多学科切换?

https://www.zhihu.com/question/333420829https://www.zhihu.com/question/333420829

excel 使用vlook up找出两列中不同的内容

当使用 VLOOKUP 函数时&#xff0c;您可以将其用于比较两列的内容。假设您要比较 A 列和 B 列的内容&#xff0c;并将结果显示在 C 列&#xff0c;您可以在 C1 单元格中输入以下公式&#xff1a; 这个公式将在 B 列中的每个单元格中查找是否存在于 A 列中。如果在 A 列中找不到…

2024159读书笔记|《南山册页:齐白石果蔬册鱼虫册》节选

2024159读书笔记|《南山册页&#xff1a;齐白石果蔬册&鱼虫册》节选 1. 《南山册页&#xff1a;齐白石鱼虫册》2. 《南山册页&#xff1a;齐白石果蔬册》 1. 《南山册页&#xff1a;齐白石鱼虫册》 《南山册页&#xff1a;齐白石鱼虫册》南山书画&#xff0c;大家之作&…

【AI驱动的数据结构:包装类的艺术与科学】

&#x1f308;个人主页: Aileen_0v0 &#x1f525;热门专栏: 华为鸿蒙系统学习|计算机网络|数据结构与算法 ​&#x1f4ab;个人格言:“没有罗马,那就自己创造罗马~” 文章目录 包装类装箱和拆箱阿里巴巴面试题 包装类 在Java中基本数据类型不是继承来自Object&#xff0c;为了…

Nginx 双向链表 ngx_queue_t

目录 一、基本概述 二、数据结构 三、接口描述与实现 1、相关宏接口 2、ngx_queue_middle 3、ngx_queue_sort 四、使用案例 整理自 nginx 1.9.2 源码 和 《深入理解 Nginx&#xff1a;模块开发与架构解析》 一、基本概述 双向链表的优势是可以快速进行数据插入、删除与…

亚信安全春节14天双倍假期通告

亚信安全14天双倍假期来袭 “网安福利王”再次实至名归 2024年 8773小时&#xff0c;31582680秒 亚信安全一直驰骋于云网安世界 奋战在“安全 数智化”的壮阔征途上 如今&#xff0c;新春的脚步渐近 长达14天的春节长假 能让我们暂且放下忙碌的工作 去除班味&#xff0c…