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

Html1

news 来源：原创 2025/5/21 11:49:04

一，HTML概述

网页开发需要学习的知识：
   html
   css
   javaScript

   两个框架
       VUE.js
       ElementUI UI user interface 用户界面

HTML xml 可扩展标记语言-->存储数据
Markup Language标签语言都会提供各种标签

html （HyperText Markup Language）超文本标记语言
   文本：文字字符
   超文本：指的是网页内容
   标记：标签标识 eg：买商品，商品上有标签，介绍了商品信息

   超文本标记语言中会提供许多不同功能的标签，使用这些标签来修饰我们这些网页的内容，通过浏览器运行解释网页，最终运行出我们想要的效果


   html语言就是一种标记语言，提供了许多的标签，不同的标签功能不同
                           网页就是通过这些标签描述出来的
                           最终有浏览器解释运行成我们看到的网页
eg： <a href="地址">百度</a> 定义一个超链接

二，HTML基本语法

1. html注释样式

2.HTML基本样式

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body></body>
</html>

（1）<!DOCTYPE html>

声明html语言的版本信息，告诉浏览器以html5标准解释运行

（2）<html> </html>

骨架标签，根标签

所有标记语言都必须有一个根标签

html是网页中的根标签，所有内容都应该写在此标签中

（3）<head> </head>

头标签主要对网页做设置：字符编码，标题，css样式，js脚本

包含了所有头部标签标签

头部区域的标签都有：<title>，<style>,<meta>,<link>,<script>

<title>：定义网页标题

（4）<body></body>

身体标签，用来写网页内容

3.标签

HTML中的标记指的就是标签

HTML使用标记标签来描述网页

（1）标签结构和写法

        1.闭合标签（双标签）
       2.自闭合标签：只有标签名，没有开始结束，完成一个特定的功能即可
       <标签名>
       <开始标签>标签体</结束标签>       闭合标签(双标签) 只对标签体内的内容进行修饰

（2）标签属性

<标签名属性="" />完成一个特定的设置功能,没有标签体自闭和标签(单标签)
       标签中可以有属性:可以标签属性改变变迁愿挨的显示风格
       <body text="red" bgcolor="green">
       属性写在标签的开始标签中
       一个标签可以有多个属性
       属性名 = "值"

三，基本常用标签

1，标题标签

共六种区别为从大到小，一个标签占一行

2，换行标签

<br/>

在前端代码中按enter键只能对代码进行换行，但向浏览器渲染时无法换行

所以使用<br/>换行（可被扫描识别）

3，段落标签

<p></p>p

一个<p>标签，代表一个独立段落，段落与段落之间有间隔

4，列表标签

（1）无序列表

<ul><li>列表项1</li><li>列表项2</li><li>列表项3</li><li>列表项4</li>
</ul>

（2）有序列表

<ol><li>列表项1</li><li>列表项2</li><li>列表项3</li><li>列表项4</li>
</ol>

通过给标签<ol>加属性type将其改为不同序列的有序标签

样式：<ol type=" ">

5，超链接

<a></a>

HTML使用超链接与网络上另一个文档相连，通俗的说就是使用超链接来访问其他网页资源

href 链接所要超链接地址

taeget 选择打开位置，_self在超链页面打开覆盖原本页面，_blank另起新窗口打开

6，图片链接

<img/>

注：图片的宽高一般不建议使用

7，转义字符

在HTML中预留了一些字符，这些字符不能再网页中直接使用

&lt；小于号
&gt；大于号
&nbsp；空格
&copy；版权（C）
&reg；注册商标（R）
&trade；商标（TM）

8，表格

（1）构成表格的标签

table标签：表格标签

tr标签：表格中的行

th标签:表格的表头（作为表头，其中数据会加粗，居中）

td标签：表格单元格

（2）表格的基本结构

<table>定义表格
<tr>定义表行
<th>定义表头</th>
</tr>
<tr>
<td>定义单元格</td>
</tr>
</table>

（3）表格属性

width：定义宽
height：定义高
cellpadding 只能写在table中定义表格数据距表格边框距离内边距
cellspacing 只能写在table中定义不同单元格之间距离外边距
align="内容水平方向对齐方式" left（默认） center right
valign="内容垂直方向对齐方式" top middle（默认） bottom
colspan="4" 合并列从哪里额开始合并，在那列添加colspan="合并的数量" 记得删除多余的单元格
rowspan="4" 跨行合并单元格

例子：

eg1

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><!-- table 表示一个表格  可以设置宽和高cellpadding 只能写在table中 定义表格数据距表格边框距离   内边距cellspacing 只能写在table中 定义不同单元格之间距离      外边距tr    表示一行      设置行高th    表示一个单元格，还是表头，内容会加粗，并且居中td    表示一个单元格，align="内容水平方向对齐方式" left（默认） center rightvalign="内容垂直方向对齐方式" top middle（默认） bottom表格中的数据都只能写在单元格中--><table border="1" width="400" ><tr height="80" width="600"><th>姓名</th><th>java</th><th width="800">c</th><th>python</th></tr><tr><td>张三</td><td>50</td><td>80</td><td>90</td></tr><tr height="100" ><td align="center">张三</td><td valign="bottom">50</td><td align="center" valign="top">80</td><td>90</td></tr><tr><td>张三</td><td>50</td><td>80</td><td>90</td></tr></table></body>
</html>

eg2

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><!-- 快捷键  table>tr*4>td*4 创建一个4行4列的表格 --><!-- colspan="4" 合并列 从哪里额开始合并，在那列添加colspan="合并的数量" 记得删除多余的单元格  --><!-- rowspan="4" 跨行合并单元格  --><table border="1" width="400" height="300" ><tr><td colspan="4"></td></tr><tr><td></td><td></td><td></td><td rowspan="4"></td></tr><tr><td></td><td></td><td></td></tr><tr><td></td><td></td><td></td></tr></table></body>
</html>

Html1

一，HTML概述网页开发需要学习的知识： html css javaScript 两个框架 VUE.js ElementUI UI user interface 用户界面 HTML xml 可扩展标记语言-->存储数据 Markup Language标签语言都会提供各种标…...

编程日记 2025/5/21 11:49:04

runpod team 怎么设置自己的ssh key呢？

生成 ed25519 公钥密钥 ssh-keygen -t ed25519 -C "yourqq.com"然后在pod容器配置key以及启动方式选择edit pod 添加启动代码启动代码可以参考官方给的内容： https://docs.runpod.io/pods/configuration/use-ssh bash -c apt update;DEBIAN_FRONT…...

编程日记 2025/5/11 22:57:10

Flutter：组件10、倒计时

import dart:async; import package:flutter/material.dart;class CountdownTimer extends StatefulWidget {final int seconds;final double? fontSize;final Color? textColor;final bool showDays;final bool showHours;final bool showMinutes;final bool showSeconds;fi…...

编程日记 2025/5/15 19:11:59

存储器分类

按宏观分类内部存储：用于临时存储当前程序运行所需要的数据外部存储：指硬盘，用于存储需要保存下的数据按存储功能分磁盘存储器(Disk)，如机械硬盘非易失性存储器（Flash memory），分为固态硬…...

编程日记 2025/4/30 6:29:33

案例解析：基于量子计算的分子对接-QDOCK（Quantum Docking）

分子对接（Moleculardocking）在药物发现中具有重要意义，但对接的计算速度和准确率始终难以平衡，其巨大解搜索空间对传统计算机来说异常艰巨。本文通过引入网格点匹配（GPM, Grind point matching）和特征原子…...

编程日记 2025/5/18 4:04:15

人工智能和机器学习在包装仿真中的应用与价值

引言随着包装成为消费品关键的差异化因素，对智能设计、可持续性和高性能的要求比以往任何时候都更高。为了满足这些复杂的期望，公司越来越多地采用先进的仿真方法，而现在人工智能 (AI) 和机器学习 (ML) 又极大地增强了这些方法。本文探讨…...

编程日记 2025/5/21 10:46:31

系统的环境变量

目录基本概念用途之一环境变量表命令行参数表理解更多的环境变量基本概念环境变量(environmentvariables)⼀般是指在操作系统中⽤来指定操作系统运⾏环境的⼀些参数。环境变量通常具有某些特殊⽤途，还有在系统当中通常具有全局特性用途之一我们看…...

编程日记 2025/5/21 11:06:23

css3伸缩盒模型第一章(主轴以及伸缩盒模型)

css3伸缩盒模型第一章(主轴) 一、伸缩盒模型简介 2009 年， W3C 提出了一种新的盒子模型 —— Flexible Box （伸缩盒模型，又称：弹性盒子）。它可以轻松的控制：元素分布方式、元素对齐方式、元素视觉顺序 ……...

编程日记 2025/5/21 11:29:41

【MySQL】(9) 视图

一、什么是视图视图是一张虚拟表，是表、其它视图的查询结果集。它本身不像基础表（物理表）一样存储数据，而是将 SQL 查询语句包装起来，通过执行查询语句动态生成数据。二、视图的作用当我们需要频繁使用一条查询语句…...

编程日记 2025/5/21 10:30:53

day10 python机器学习全流程实践

在机器学习的实践中，数据预处理与模型构建是极为关键的环节。本文将回顾数据预处理的全流程，并基于处理后的数据完成简单的机器学习建模与评估，暂不涉及复杂的调参过程。一、预处理流程回顾机器学习的成功，很大程度上依赖于高…...

编程日记 2025/5/21 11:40:27

Rust Ubuntu下编译生成环境win程序踩坑指南

前言： 1，公司要给一线搞一个升级程序，需要在win下跑。之前都是找开发总监帮忙，但是他最近比较忙。就让我自己搞。有了下文.。说来惭愧，之前写过一篇ubuntu下编译windows的文章。里面的demo就一句话 fuck world。依赖…...

编程日记 2025/5/21 10:29:20

2025年- H12-Lc119-56.合并区间（普通数组）---java版

1.题目描述 2.思路思路参考了代码随想录： 按照左边界从小到大排序之后，如果 intervals[i][0] < intervals[i - 1][1] 即intervals[i]的左边界 < intervals[i - 1]的右边界，则一定有重叠。（本题相邻区间也算重贴&#xff…...

编程日记 2025/5/21 11:33:26

合并两个有序链表

题目：21. 合并两个有序链表将两个升序链表合并为一个新的升序链表并返回。新链表是通过拼接给定的两个链表的所有节点组成的。示例 1： 输入：l1 [1,2,4], l2 [1,3,4] 输出：[1,1,2,3,4,4]示例 2： 输入&#x…...

编程日记 2025/4/30 6:27:22

rsync命令详解与实用案例

rsync命令详解与实用案例 rsync是一款功能强大的Linux文件同步工具，通过高效的增量传输算法，能够显著减少数据传输量和时间，是备份、镜像和跨平台文件同步的理想选择。其核心价值在于只传输文件的差异部分，而非全量复制&#xff…...

编程日记 2025/4/30 6:27:21

gitee 如何修改提交代码的邮箱

gitee 如何修改提交代码的邮箱 1. 修改全局提交邮箱2. 修改特定仓库的提交邮箱3. 修改已提交记录的邮箱 4. 可能遇到的问题git filter-repo 拒绝执行解决办法方法一：使用 --force 参数 （亲测有效）方法二：创建一个全新的克隆仓库注…...

编程日记 2025/5/19 8:59:21

MATLAB画一把伞

% 伞的参数num_ribs 5; % 伞骨数量修改为5R 1; % 伞的半径height 0.5; % 伞的高度handle_length 2; % 伞柄长度semicircle_radius 0.26; % 伞柄末端半圆的半径% 生成伞叶网格theta linspace(0, 2*pi, 100);phi linspace(0, pi/2, 50);[Theta, Phi] meshgrid(theta, phi…...

编程日记 2025/5/21 11:40:27

vue 实现文件流下载功能前端实现文件流下载

首先场景就是，一般的文件下载是通过后端返回的文件地址下载文件，但当后端返回的是文件流的时候，下载要做特殊处理案例截图：下载成功：代码处理，首先就是要在接口封装的地方加上在 Vue 前端开发中实现文件流下载与普通文件下载的核心区别在于数据处理方式。文件流…...

编程日记 2025/4/30 6:26:17

[Android]导航栏中插入电源菜单

1. 新增 frameworks/base/packages/SystemUI/res/layout/power.xml <?xml version"1.0" encoding"utf-8"?> <com.android.systemui.navigationbar.buttons.KeyButtonView xmlns:android"http://schemas.android.com/apk/res/android"…...

编程日记 2025/5/4 9:19:55

VSCode Verilog环境搭建

VSCode Verilog环境搭建下载Iverilog安装Iverilog验证安装VS Code安装插件下载Iverilog 官网下载Iverilog 安装Iverilog 一定要勾选这两项建议勾选这两项验证安装运行Windows PowerShell输入命令：iverilog输入命令：Get-Command gtkwave …...

编程日记 2025/5/21 11:20:59

Hadoop 和 Spark 生态系统中的核心组件

通过jps命令，可以看到如下进程名，请解释一下它们各自是哪个命令产生的，有什么作用？一、Worker 1.来源：Spark 集群的工作节点（Worker Node），由 start-worker.sh 启动 2.作用&#…...

编程日记 2025/4/30 6:25:14

MySQL多表操作

熟能生巧，全部代码在最后！！！ 一、多表关系一对一关系、一对多关系、多对多关系注意多对多关系必须有中间表进行关联多对多的关系就相当于是两个一对多关系二、创建外键约束专门用于多表操作的一种约束方式控制的那个表…...

编程日记 2025/5/21 11:36:35

WPF TextBlock控件性能优化指南

WPF TextBlock控件性能优化指南 1. 引言 TextBlock作为WPF中最基础且使用最广泛的文本显示控件，其性能优化对整个应用程序的响应速度和资源占用有着重要影响。尽管TextBlock是一个轻量级控件，但在大型应用或需要显示大量文本的场景中，不恰当…...

编程日记 2025/5/21 10:25:15

DotNet 入门：(一) 环境安装

一、前言本想用 Go 语言实现一个通过小爱同学操作电脑的，比如我对着手机说打开音乐，或调小音乐，电脑能做相应的处理。奈何我一时间没看懂，就想着用.Net 来试一下，于是就有了下面这篇文章。二、安装.Net 环境 1. 下…...

编程日记 2025/5/18 8:35:59

初识Redis · 分布式锁

目录前言： 分布式锁 setnx lua脚本和看门狗 redlock算法 Redlock 的加锁流程（5 步） 前言： 到了分布式锁这一章之后，我们首先能联想到的问题就是线程安全的问题，线程安全指的是多个线程在并发执行的…...

编程日记 2025/4/30 6:24:02

使用 OpenCV 实现图像中心旋转

在图像处理中，围绕中心点旋转图像是一个常见的需求。无论是为了数据增强、视觉效果，还是图像对齐，旋转图像都是一项基础且重要的操作。本文将详细介绍如何使用 OpenCV 实现围绕图像中心旋转的功能，并深入探讨其背后的数学原理。一…...

编程日记 2025/4/30 6:24:01

云钥科技红外短波工业相机

云钥科技的红外短波相机是一款基于短波红外（SWIR，波长范围约1-3微米）技术的成像设备，专为高精度检测、全天候成像及特殊场景应用设计。以下从核心技术、性能参数、应用场景及产品优势等方面进行详细介绍： 一、核心…...

编程日记 2025/4/30 6:24:01

npm如何安装pnpm

在 npm 中安装 pnpm 非常简单，你可以通过以下步骤完成： 1. 使用 npm 全局安装 pnpm 打开终端（命令行工具），运行以下命令： npm install -g pnpm2. 验证安装安装完成后，可以检查 pnpm 的版本以确保安装成功： pnpm --version如果正确显示版本号（如 8.x.x），说明安…...

编程日记 2025/4/30 6:22:59

GTC Taipei 2025 医疗域前瞻：从AI代理到主权生态，解码医疗健康与生命科学的未来图景

引言 2025年，全球医疗健康领域正经历一场由人工智能、机器人技术与分布式计算驱动的范式转移。随着NVIDIA及其生态伙伴在GTC Taipei 2025大会上的深度布局，医疗行业的核心趋势愈发清晰：AI代理程序（Digital AI Agents）赋能临床协作、医疗大数据与精准医学加速落地、医学影…...

编程日记 2025/5/18 2:21:27

【AI学习】李宏毅新课《DeepSeek-R1 这类大语言模型是如何进行「深度思考」（Reasoning）的？》的部分纪要

针对推理模型，主要讲了四种方法，两种不需要训练模型，两种需要。对于reason和inference，这两个词有不同的含义！ 推理时计算不是新鲜事，AlphaGo就是如此。这张图片说明了将训练和推理时计算综合考虑的关系&…...

编程日记 2025/5/16 14:14:39

npm打包内存不足- JavaScript heap out of memory

直接贴出报错信息 <--- Last few GCs --->[30904:0000010F60FE58E0] 22090 ms: Scavenge 2037.4 (2069.4) -> 2036.4 (2074.2) MB, 2.5 / 0.0 ms (average mu 0.228, current mu 0.216) allocation failure [30904:0000010F60FE58E0] 22101 ms: Scavenge 2…...

编程日记 2025/5/13 18:32:25

【最新 MCP 战神手册 08】工具使用详解：实现 AI 行动

文章目录 1. 开始啦！2. 第一部分：设计高效且安全的工具3. 第二部分：定义工具蓝图——参数、输出与约束条件4. 第三部分：弥合差距：LLM 兼容性（函数调用）5. 第四部分：实施与测试的最佳实践1. 开始啦！在前几章中，我们将工具介绍为 AI 模型在 MCP 客户端引导下向 MCP 服…...

编程日记 2025/4/30 6:22:57

开发iOS App时，我常用的一款性能监控小工具分享

开发iOS App时，我常用的一款性能监控小工具分享最近在做一个iOS应用的性能优化，频繁遇到内存泄露、界面卡顿和网络请求超时的问题。平时用Xcode Instruments虽然专业，但流程繁琐，临时排查问题不够灵活。于是开始找有没有轻量一…...

编程日记 2025/5/12 8:39:56

如何防止 ES 被 Linux OOM Killer 杀掉

当 Linux 系统内存不足时，内核会找出一个进程 kill 掉它释放内存，旨在保障整个系统不至于崩溃。如果 ES 按照最佳实践去实施部署，会保留一半的内存，不至于发生此类事情。但事情总有例外，有的朋友可能 ES 和其他的程序部…...

编程日记 2025/4/30 6:21:55

Windows权限与icacls命令详解

在Windows操作系统中，权限管理是确保系统安全和资源访问控制的核心机制。特别是在使用NTFS（New Technology File System）文件系统的环境中，访问控制列表（ACL）用于定义哪些用户或组可以对文件、文件夹或其他…...

编程日记 2025/4/30 6:20:54

5.4.2 MVVM例2-用户控件的使用（水在水管中流动的实例）

本文以一个例子介绍用户控件的使用(UserControl)，下图所示：一、主要技术点 1.MainViewModel使用CommunityToolkit.Mvvm 这个Nuget包 2.LinearGradientBrush使用，下面代码可以产生如下的效果 <LinearGradientBrush x:Key="HorizontalBackground" …...

编程日记 2025/4/30 6:20:53

PHP代码-服务器下载文件页面编写

内部环境的服务资源下载页面有访问需求，给开发和产品人员编写一个简洁的下载页面提供资源下载。直接用nginxphp的形式去编写了，这里提供展示index.php文件代码如下： <?php // 配置常量 define(BASE_DIR, __DIR__); // 当前脚本所在目录作…...

编程日记 2025/4/30 6:20:52

51单片机快速入门之 SPI通信 2025年4月29日09:26:32

SPI通信 : SPI（Serial Peripheral Interface）通信是一种同步串行数据传输协议，主要用于嵌入式系统内部设备之间的通信。它由Motorola公司在2000年提出，广泛应用于微控制器、传感器、存储设备等之间的数据传输。 SPI通信的主要特点…...

编程日记 2025/5/16 8:08:48

SpringMVC再复习1

一、三层架构表现层（WEB 层） 定义 ：是应用程序与客户端进行交互的最外层，主要负责接收用户的请求，并将处理结果显示给用户。作用 ：在 Spring MVC 中，表现层通常采用 MVC 设计模式来构建。技…...

编程日记 2025/5/18 2:52:09

音视频之H.265/HEVC网络适配层

H.265/HEVC系列文章： 1、音视频之H.265/HEVC编码框架及编码视频格式 2、音视频之H.265码流分析及解析 3、音视频之H.265/HEVC预测编码 4、音视频之H.265/HEVC变换编码 5、音视频之H.265/HEVC量化 6、音视频之H.265/HEVC环路后处理 7、音视频之H.265/HEVC熵编…...

编程日记 2025/4/30 6:19:49

01_微服务常见问题

文章目录微服务常见问题一、常见问题概要一、问题详解1.1 服务拆分1.2 服务通信1.3 服务注册与发现1.4 服务治理1.5 数据一致性1.6 故障隔离与容错处理1.7 数据库设计1.8 性能测试与调优微服务常见问题一、常见问题概要 ‌服务拆分‌：如何合理地拆分服务&#…...

编程日记 2025/4/30 6:19:48

Python在自动驾驶仿真环境中的应用：构建智能驾驶的虚拟世界

Python在自动驾驶仿真环境中的应用：构建智能驾驶的虚拟世界引言随着自动驾驶技术的迅速发展，仿真环境的构建变得愈发重要。传统的测试方法依赖物理车辆和道路进行验证，但这种方式不仅成本高昂，还存在一定的风险。为了加速自动驾驶技术的研发，仿真环境成为了一个必不可…...

编程日记 2025/4/30 6:19:47

【统计方法】交叉验证：Resampling, nested 交叉验证等策略【含R语言】

Resampling (重采样方法) 重采样方法是从训练数据中反复抽取样本，并在每个（重新）样本上重新调整模型，以获得关于拟合模型的附加信息的技术。两种主要的重采样方法 Cross-Validation (CV) 交叉验证 ： 用于估计测试误…...

编程日记 2025/5/18 1:14:04

海外App数据隐私架构实战：构建GDPR、CCPA合规的全栈解决方案

一、隐私合规的架构范式转变从“数据收集”到“数据最小化”传统模式：尽可能收集数据 → 导致合规风险隐私原生模式：默认不收集 → 按需申请 → 自动过期kotlin// Android权限动态申请示例（GDPR兼容） val request PermissionRe…...

编程日记 2025/4/30 6:18:45

Prometheus监控

1、docker - prometheusgrafana监控与集成到spring boot 服务_grafana spring boot-CSDN博客 2、【IT运维】普罗米修斯基本介绍及监控平台部署（PrometheusGrafana）-CSDN博客 3、Prometheus监控SpringBoot-CSDN博客 4、springboot集成普罗米修斯-CSDN博客…...

编程日记 2025/4/30 6:18:45

Vue3 Echarts 3D圆形柱状图实现教程以及封装一个可复用的组件

文章目录前言一、实现原理二、series ——type: "pictorialBar" 简介2.1 常用属性三、代码实战3.1 封装一个echarts通用组件 echarts.vue3.2 首先实现一个基础柱状图3.3 添加上下2个椭圆面3.4 进阶封装一个可复用的3D圆形柱状图组件总结前言在前端开发的数据可视…...

编程日记 2025/4/30 6:17:43

洛谷P12238 [蓝桥杯 2023 国 Java A] 单词分类

[Problem Discription] \color{blue}{\texttt{[Problem Discription]}} [Problem Discription] Copy from luogu. [Analysis] \color{blue}{\texttt{[Analysis]}} [Analysis] 既然都是字符串前缀的问题了，那当然首先就应该想到 Trie \text{Trie} Trie 树。我们可…...

编程日记 2025/4/30 6:17:43