当前位置： 首页 > news >正文

Html--笔记01：使用软件vscode，简介Html5--基础骨架以及标题、段落、图片标签的使用

news 2026/5/13 0:52:59

一.使用VSC--全称：Visual Studio Code

vscode用来写html文件，打开文件夹与创建文件夹：①选择文件夹  ②拖拽文件

生成浏览器的html文件的快捷方式：  ！+enter

运行代码到网页的方法：

普通方法：找到书写代码的文件夹，点击使用浏览器打开

在vscode快速使用：需要添加插件：Open In  Bower，然后右击选择：Open In Default Brower(默认浏览器) ，Open In Other Brower(选择其他浏览器)----推荐使用，更快捷方便。

vscode快捷键：

shift+alt+F代码格式化
alt+↑/↓将选则的代码向上或向下
shift+alt+↑/↓快速复制一行向上或向下
ctrl+s保存▲
ctrl+F快速查找
ctrl+H快速替换

二.HTML简介和基础骨架

Html5：是一种超文本标记语言，用来描述网页的一种语言。

标记语言<----标记标签<----双标签：<html></html>   ,单标签：<img> 

HTML5的DOCTYPE声明：

<!DOCTYPE html> 位于H5声明文档的最上面，处于标签之前，是网页的必备组成，避免浏览器的怪异模式

HTML5的基础骨架：

<html>标签:定义HTML文档，浏览器看到后就是个html文档了，所有其他元素就包裹在它里面，html标签限定了文档的开始点和结束点。

<head>标签：用于定义文档的头部，在头部描述了文档的各种属性和信息，包括文档的标题，在web的位置。

<body>标签：元素定义的文档的主体，body元素：包含文档的所有内容(比如文件，超链接，图像，表格和列表)，会直接在页面显示，也是直接看到的内容。

以上就是Html5的基础骨架

拓展基础标签：

title 标签：

可以定义文档的标签，显示在浏览器的标题或状态栏上

<title>标签是<head>标签中唯一必须要求包含的东西，就是在<head>中必须有<title>。

<title>的增加有利于SEO优化----SEO搜索引擎优化的英文缩写，通过对网站内容调整，满足搜索引擎的排名需求

mate标签：

meta标签用来描述网页文档属性，关键词等，更多的都是字符编码： charset="UTF-8",也是在<head>标签里的

三.标题标签：

标题(Heading)通过：<h1>--<h6>标签进行定义

<h1>定义最大的标题 ,<h6>定义最小的标题。

这里的align是指内容的位置属性，默认居左，可以选择left | center |right

 生成h1到h6快捷键：  h$*6 

注意：要正确的使用标题标签，HTML的标题标签只用于标题，不仅仅只是为了生成粗体或者头号字体而使用，正确使用有利于SEO，h1--h6是先后顺序的且重要程度也是由重到轻。

四.标签--段落，换行，水平线

段落：通过<p>标签定义，

换行：希望将一个段落进行换行，就在分割处加一个<br>或者<br />都可以 

效果如下：

水平线： <hr />单行标签：在HTML页面会创建水平线具体属性有：

color---颜色，width--长度，size--大小，alig--对齐方式(默认居中)，也可取值left | right。

具体实例在上图。

五.标签--图片

插入图片， <img>标签定义HTML页面中的图像：

<img  src=""   alt""   title=""  width=""  height="" >

<img>是单标签，不需要进行闭合操作

src--(图片地址与名字)路径

alt--图像替换文本，若图像加载失败，就会显示文本信息

width--宽度

heigth--高度

title--鼠标放在图片会有提示

感谢各位大佬的观看！求免费的点赞收藏关注喔！！！

相关文章：

Html--笔记01：使用软件vscode，简介Html5--基础骨架以及标题、段落、图片标签的使用

一.使用VSC--全称&#xff1a;Visual Studio Code vscode用来写html文件&#xff0c;打开文件夹与创建文件夹&#xff1a;①选择文件夹 ②拖拽文件 生成浏览器的html文件的快捷方式&#xff1a; &#xff01;enter 运行代码到网页的方法&#xff1a; 普通方法&#xff1a…...

编程日记 2024/9/29 15:34:42

探索反向传播：深度学习中优化神经网络的秘密武器

反向传播的概念&#xff1a; 反向传播&#xff08;Backpropagation&#xff09; 是深度学习中训练神经网络的核心算法。它通过有效计算损失函数相对于模型参数的梯度&#xff0c;使得模型能够通过梯度下降等优化方法逐步调整参数&#xff0c;从而最小化损失函数&#xff0c;提…...

编程日记 2024/9/29 15:33:41

K8S精进之路-控制器DaemonSet -(3)

介绍 DaemonSet就是让一个节点上只能运行一个Daemonset Pod应用&#xff0c;每个节点就只有一个。比如最常用的网络组件&#xff0c;存储插件&#xff0c;日志插件&#xff0c;监控插件就是这种类型的pod.如果集群中有新的节点加入&#xff0c;DaemonSet也会在新的节点创建出来…...

编程日记 2024/9/29 15:31:38

【JVM】类加载机制

文章目录 类加载机制类加载过程1. 加载2. 验证3. 准备4. 解析偏移量符号引用和直接引用 5. 初始化 类加载机制 类加载指的是&#xff0c;Java 进程运行的时候&#xff0c;需要把 .class 文件从硬盘读取到内存&#xff0c;并进行一些列的校验解析的过程&#xff08;程序要想执行…...

编程日记 2024/9/29 15:29:35

ENV | 5步安装 npm node（homebrew 简洁版）

1. 操作步骤 1.1 安装 homebrew /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"1.2 安装 node # 安装最新版 brew install node # 安装指定版本&#xff0c;如18 brew install node181.3 安装 nvm&#xff08…...

编程日记 2024/9/29 15:28:33

EasyExcel全面实战：掌握多样化的Excel导出能力

1 概述 本文将通过实战案例全面介绍EasyExcel在Excel导出方面的多种功能。内容涵盖多表头写入、自定义格式、动态表头生成、单元格合并应用等。通过这些实例，读者可以掌握EasyExcel的各种高级功能，并在实际项目中灵活应用。 白日依山尽，黄河入海流。 欲穷千里目，更上一层楼…...

编程日记 2024/9/29 15:25:30

基于springcloud的药品销售系统

文未可获取一份本项目的java源码和数据库参考。 一、选题背景与意义 1. 选题背景 在日常医药管理中&#xff0c;面对众多的药品和众多不同需求的顾客&#xff0c;每天都会产生大量的数据信息。以传统的手工方式来处理这些信息&#xff0c;操作比较繁琐&#xff0c;且效率低下…...

编程日记 2024/9/29 15:23:28

基于组网分割的超大规模设计 FPGA 原型验证解决方案

引言 如何快速便捷的完成巨型原型验证系统的组网&#xff0c;并监测系统的连通性及稳定性&#xff1f; 如何将用户设计快速布局映射到参与组网的原型验证系统的每一块 FPGA&#xff1f; 随着用户设计规模的日益增大&#xff0c;传统基于单片 FPGA 或单块电路板的原型验证系统…...

编程日记 2024/9/29 15:22:26

C# 面向对象基础，简单的银行存钱取钱程序

题目&#xff1a; 代码实现&#xff1a; BankAccount部分&#xff1a; using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks;namespace Bank {internal class BankAccount{private decimal balance 0;//账…...

编程日记 2024/9/29 15:21:25

【Rockchip系列】官方函数：drm_buf_alloc

drm_buf_alloc 函数 功能 分配一个DRM&#xff08;Direct Rendering Manager&#xff09;缓冲区。 语法 void* drm_buf_alloc(int width, int height, int bpp, int* fd, int* handle, size_t* size, int flags);参数 width: 缓冲区宽度&#xff08;像素&#xff09;heigh…...

编程日记 2024/9/29 15:20:24

深度学习--------------------------------门控循环单元GRU

目录 门候选隐状态隐状态门控循环单元GRU从零开始实现代码初始化模型参数定义隐藏状态的初始化函数定义门控循环单元模型训练该部分总代码简洁代码实现 做RNN的时候处理不了太长的序列&#xff0c;这是因为把整个序列信息全部放在隐藏状态里面&#xff0c;当时间很长的话&#…...

编程日记 2024/9/29 15:19:23

【实战】| X小程序任意用户登录

复现步骤 在登陆时&#xff0c;弹出这个页面时 抓包&#xff0c;观察数据包的内容 会发现有mobile值&#xff08;密文&#xff09;和iv值&#xff08;随机数&#xff09;&#xff0c;拿到密文&#xff0c;肯定时想到解密&#xff0c;想要解密就必须知道密文&#xff0c;…...

编程日记 2024/9/29 15:18:21

计算机毕业设计之：云中e百货微信小程序设计与实现（源码+文档+定制）

博主介绍&#xff1a; ✌我是阿龙&#xff0c;一名专注于Java技术领域的程序员&#xff0c;全网拥有10W粉丝。作为CSDN特邀作者、博客专家、新星计划导师&#xff0c;我在计算机毕业设计开发方面积累了丰富的经验。同时&#xff0c;我也是掘金、华为云、阿里云、InfoQ等平台…...

编程日记 2024/9/29 15:16:19

CEX上币趋势分析：Infra赛道与Ton生态的未来

在当前的加密市场中&#xff0c;CEX&#xff08;中心化交易所&#xff09;上币的选择愈发重要&#xff0c;尤其是对项目方而言。根据 FMG 的整理&#xff0c;结合「杀破狼」的交易所上币信息&#xff0c;显然 Infra 赛道成为了交易所的热门选择&#xff0c;而 Ton 生态也展现出…...

编程日记 2024/9/29 15:14:17

数组基础（c++）

第1题 精挑细选 时限&#xff1a;1s 空间&#xff1a;256m 小王是公司的仓库管理员&#xff0c;一天&#xff0c;他接到了这样一个任务&#xff1a;从仓库中找出一根钢管。这听起来不算什么&#xff0c;但是这根钢管的要求可真是让他犯难了&#xff0c;要求如下&#x…...

编程日记 2024/9/29 15:13:15

第十三届蓝桥杯真题Python c组A.排列字母(持续更新)

博客主页&#xff1a;音符犹如代码系列专栏&#xff1a;蓝桥杯关注博主&#xff0c;后期持续更新系列文章如果有错误感谢请大家批评指出&#xff0c;及时修改感谢大家点赞&#x1f44d;收藏⭐评论✍ 【问题描述】 小蓝要把一个字符串中的字母按其在字母表中的顺序排列。 例如&a…...

编程日记 2024/9/29 15:12:14

IDEA自动清理类中未使用的import包

目录 1.建议清理包的理由 2.清理未使用包的方式 2.1 手动快捷键清理 2.2 设置自动清理 1.建议清理包的理由 有时候项目类文件中会有很多包被引入了&#xff0c;但是并没有被使用&#xff0c;这会增加项目的编译时间并且代码可读性也会变差。在开发过程中&#xff0c;建议设…...

编程日记 2024/9/29 15:11:13

加工零件C++

题目: 样例解释&#xff1a; 样例#1&#xff1a; 编号为 1 的工人想生产第 1 阶段的零件&#xff0c;需要编号为 2 的工人提供原材料。 编号为 2 的工人想生产第 1 阶段的零件&#xff0c;需要编号为 1 和 3 的工人提供原材料。 编号为 3 的工人想生产第 1 阶段的零件&#x…...

编程日记 2024/9/29 15:10:12

Etcd 是一个分布式的键值存储系统，用于共享配置和服务发现

Etcd 是一个分布式的键值存储系统&#xff0c;用于共享配置和服务发现。它最初由 CoreOS 开发&#xff0c;并已成为许多分布式系统中的关键组件之一&#xff0c;特别是在 Kubernetes 中扮演着核心角色。Etcd 的设计目标是简单、可靠、安全&#xff0c;并且易于使用。 Etcd 的特…...

编程日记 2024/9/29 15:09:11

如何帮助我们改造升级原有架构——基于TDengine 平台

一、简介 TDengine 核心是一款高性能、集群开源、云原生的时序数据库&#xff08;Time Series Database&#xff0c;TSDB&#xff09;&#xff0c;专为物联网IoT平台、工业互联网、电力、IT 运维等场景设计并优化&#xff0c;具有极强的弹性伸缩能力。同时它还带有内建的缓存、…...

编程日记 2024/9/29 15:07:09

通过curl命令快速测试Taotoken提供的各类大模型API响应效果

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 通过curl命令快速测试Taotoken提供的各类大模型API响应效果 对于习惯命令行操作或需要在无SDK环境中验证集成的开发者而言&#xf…...

编程新知 2026/5/12 22:46:42

现代差旅电力管理实战：从充电安全到设备续航全攻略

1. 一次久违的飞行&#xff1a;无处不在的电力焦虑与科技依赖距离上一次飞行已经过去了整整十七个月。当我上周踏入纽约拉瓜迪亚机场&#xff0c;准备开启后疫情时代的首次旅程时&#xff0c;感觉像是进入了另一个维度。在我缺席的这段时间里&#xff0c;LGA完成了一场彻底的蜕…...

编程新知 2026/5/12 22:02:44

3步掌握SubtitleOCR：从视频到可编辑字幕的智能转换指南

3步掌握SubtitleOCR&#xff1a;从视频到可编辑字幕的智能转换指南 【免费下载链接】SubtitleOCR 快如闪电的硬字幕提取工具。仅需苹果M1芯片或英伟达3060显卡即可达到10倍速提取。A very fast tool for video hardcode subtitle extraction 项目地址: https://gitcode.com/g…...

编程新知 2026/5/12 20:54:45

别再只会点灯了！用51单片机和继电器模块，做个智能插座控制台灯（附完整代码）

从点灯到智能家居&#xff1a;51单片机与继电器模块的实战进阶指南 当你已经能够熟练地用51单片机点亮LED灯时&#xff0c;是否想过将这些基础技能转化为实际生活中的实用工具&#xff1f;本文将带你跨越实验板与真实世界的鸿沟&#xff0c;用最常见的51单片机和继电器模块&…...

编程新知 2026/5/12 20:44:03

别再想当然！用AD628/INA等差分放大器做单端采集，必须搞懂的共模电压计算（附Excel工具）

差分放大器单端采集实战指南&#xff1a;共模电压计算与设计避坑 在工业传感器接口和医疗设备信号链设计中&#xff0c;差分放大器常被用于单端信号采集的场景。许多工程师习惯性地认为&#xff0c;只要将差分放大器的负输入端接地&#xff0c;就能轻松实现单端转差分功能。但实…...

编程新知 2026/5/12 19:47:57

5个常见照片管理难题，ExifToolGUI一站式解决

5个常见照片管理难题&#xff0c;ExifToolGUI一站式解决 【免费下载链接】ExifToolGui A GUI for ExifTool 项目地址: https://gitcode.com/gh_mirrors/ex/ExifToolGui 你有没有遇到过这样的情况&#xff1f;旅行归来&#xff0c;几百张照片的拍摄时间全乱了&#xff0c…...

编程新知 2026/5/12 18:54:20

基于Node.js与Telegraf构建支持双历法的Telegram天气机器人

1. 项目概述&#xff1a;一个功能完备的Telegram天气机器人 最近在做一个需要集成天气信息的小项目&#xff0c;顺手就把之前写的一个Telegram天气机器人翻新重构了一遍。这个机器人不只是简单地查询温度&#xff0c;它融合了实时天气、24小时预报&#xff0c;并且特别加入了波…...

编程新知 2026/5/12 18:50:18

ZeroAPI：基于订阅与任务感知的AI模型智能路由插件设计与实践

1. 项目概述&#xff1a;ZeroAPI&#xff0c;一个为AI订阅服务而生的智能路由插件如果你和我一样&#xff0c;手头订阅了不止一个AI服务——比如OpenAI的ChatGPT Plus、月之暗面的Kimi、智谱AI的GLM&#xff0c;可能还有MiniMax或者通义千问——那你一定遇到过这个烦恼&#xf…...

编程新知 2026/5/12 18:18:07

别再用眼睛猜阈值了！Halcon threshold函数实战：5分钟搞定车牌字符分割

工业视觉实战&#xff1a;Halcon阈值分割在车牌识别中的精准应用 在机器视觉领域&#xff0c;车牌识别系统是典型的工业应用场景之一。而字符分割作为识别流程中的关键环节&#xff0c;直接影响最终识别准确率。许多初学者往往陷入一个误区——仅凭肉眼观察随意设置阈值参数&am…...

编程新知 2026/5/12 17:35:08

ksail：本地Kubernetes开发环境一键搭建与云原生实践

1. 项目概述&#xff1a;当Kubernetes遇上本地开发如果你是一名后端或云原生方向的开发者&#xff0c;大概率经历过这样的场景&#xff1a;为了调试一个微服务&#xff0c;你需要在本地启动一整套依赖——数据库、消息队列、缓存&#xff0c;可能还有另外两三个兄弟服务。你手忙…...

编程新知 2026/5/12 17:27:40