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

html基础-认识html

news 文章来源：https://blog.csdn.net/weixin_41765786/article/details/144505902 2025/5/19 4:31:10

1.什么是html

html是浏览器可以识别的的标记语言，我们在浏览器浏览的网页就是一个个的html文档

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>认识html</title>
</head>
<body><h1>我的第一个标题</h1><p>我的第一个段落。</p></body>
</html>

将这串代码用记事本保存起来，更改.txt后缀名为.html，拖到浏览器中就可以看到效果了。

html的组成部分

html是有html标签（元素）组成的，有时候叫html标签，有时候叫html元素，都一个意思。
例如上面的<h1></h1>标签代表标题 <p></p>标签代表段落

html 常用标签

双标记标签:
有开始有结尾例如<h1> 是开始标签 </h1>是结尾标签
单标记标签：只有一个标记。如<img /> 图片标签， <input />输入框标签

1.标题标签：html标题是通过`<h1> -<h6>`标签来定义的

<h1></h1> 显示的标题字体最大。
<h6></6> 显示的标题字体最小。

2.段落标签：p标签

<p>这是一个段落</p>

3.超链接标签：a标签

<a href = "https://www.baidu.com">点击网址进入某个页面</a>

4.容器标签 div标签

网页布局容器标签

网页由一个个div容器组成的，是网页布局排版中最常用的标签。

5.列表标签

有序列表标签

<ol><li>这是有序标签</li><li>这是有序标签</li><li>这是有序标签</li>
</ol>

网页效果是这样子的
在这里插入图片描述

有序标签

 <ul><li>这是无序标签</li><li>这是无序标签</li><li>这是无序标签</li></ul>

浏览器显示的效果是这样子的
在这里插入图片描述

6.表格标签

<table><tr><td>id</td><td>姓名</td><td>年龄</td><td>性别</td></tr>
</table>

table 代表这是一个表格容器，tr是表格中的行，td是表格中的单元格，相当于列的意思。

标签相对于标签有加粗和居中的效果

<table><tr><th>id</th><th>姓名</th><th>年龄</th><th>性别</th></tr><tr><td>1</td><td>张三</td><td>13</td><td>男</td></tr><tr><td>2</td><td>李四</td><td>14</td><td>女</td></tr><tr><td>3</td><td>王五</td><td>15</td><td>男</td></tr></table>

浏览器显示效果是这样子的
在这里插入图片描述

7.表单标签

<form>注册用户<br/><input  type="text" placeholder="请输入昵称"/><br/><input  type="password" placeholder="请输入密码"/><br/><input type="radio" name="sex" />男  <input type="radio" name="sex" >女<br/>兴趣爱好有哪些？<br/><input type="checkbox">足球 <input type="checkbox"> 篮球 <input type="checkbox"><br/>请选择图像上传<br/><input type="file"><br/>您来自那个省份？<br/><select><option>湖北</option><option>湖南</option><option>河南</option><option>广东</option></select>
</form>

在这里插入图片描述

<form></form>标签代表这是一个表单容器 <input />是输入框标签，它有不同的类型 type="text | password |radio |checkbox |file"
type="text" 代表这是一个文字输入框
type="password" 这是一个密码输入框
type="radio" 这是一个单选框
type="checbox" 这是一个复选框
type="file" 这是一个文件选择器
type="reset" 这是一个重置按钮
type="submit"这是一个确认提交按钮
type="button" 这是一个普通按钮

8.文本域标签

文本域标签也是表单组件里面的一种

<textarea cols="30" rows="10"></textarea>

在这里插入图片描述

9.块级标签

<div>标签也是块级标签但是div是一个标签独占一整行，<span>标签只占一小块
<span>hello</span>

10.音视频标签

音频

<audio src="" controls></audio>

视频

<video src="" controls width="500px" height="100px"></video>

html基础-认识html

1.什么是html html是浏览器可以识别的的标记语言，我们在浏览器浏览的网页就是一个个的html文档 <!DOCTYPE html> <html> <head> <meta charset"utf-8"> <title>认识html</title> </head> <body><h1…...

编程日记 2024/12/21 19:37:26

UE5 跟踪能力的简单小怪

A、思路 1、用素材的骨骼网格体创建小怪BP，绑定新的小怪控制器。 2、控制器的事件开始时，获取玩家状态，指定AI小怪自动向玩家移动。复杂的AI需要用强大功能如黑板、行为树。而简单的AI则可以用简单方法实现，杀鸡不用牛刀。视…...

编程日记 2024/12/21 19:33:22

Ubantu22系统安装Miniconda3

1、Anaconda和Miniconda异同清华源镜像的Miniconda3和Anaconda都是用于管理Python环境和软件包的工具，但它们之间存在一些关键的不同之处。下面将分别介绍它们的特点以及使用清华源镜像的差异。相同点： （1）功能相似&#xff1a…...

编程日记 2024/12/21 19:31:19

130、java中在使用new ArrayList＜＞(),在参数中传入一个集合的作用

在Java中，当你使用new ArrayList<>()时，你正在创建一个新的ArrayList实例。如果你在其后跟一对尖括号，并在内部传入一个集合，那么这实际上是一个"初始容量"的概念。例如，如果你有一个集合otherList&…...

编程日记 2024/12/21 19:30:18

Mybatis-plus-Join--分页查询

数据表四张： user： id,username,create_time,update_time product： id,name,price,number(库存),create_time,update_times order： id,quantity,order_time(下单时间),update_time order_detail:id,product_id,order_id,quant…...

编程日记 2024/12/21 19:29:16

对BG兼并点的理解-不断刷新版

常想常新，每次接触都有新理解，不确定想的是否正确，拿出来讨论，以最新结论为准 2024-9-19 1、仿真简并点时需要断开启动电路：启动电路会干扰DC结果的计算，可能看到加启动电路后简并点减少，但在…...

编程日记 2024/12/21 19:28:14

python的游标是什么

CURSOR（私有SQL 区）就是一个句柄，即指针或引用，指向sql私有区（一个用户的能打开的cursor数由参数open_cursors决定）【确切说，指向sql私有区里的固定部分（The persistentarea&#xf…...

编程日记 2024/12/21 19:27:12

硬件---14---PCB学习：PCB封装库及布局操作

一PCB封装元素的组成与介绍二实例-贴片0603封装的创建 1封装命名找不到封装库创建页面，可以配合右下角的Panels去找。找到0603电阻或者电容的PCB封装，根据提供尺寸去设计PCB的封装。 <1>双击PCB器件封装 <2>命名 2放置焊盘&#xff…...

编程日记 2024/12/21 19:24:10

什么是MyBatis

MyBatis 简介 MyBatis 是一个流行的 Java 持久层框架（Persistence Framework），它主要用于简化数据库操作，提供了对数据库的映射支持，使得开发人员能够通过简单的配置和映射文件来执行数据库操作（如增、删、…...

编程日记 2024/12/21 19:20:06

开发技术-Java改变图片格式

图片上传页未做控制，导致上传的是GIF格式，导致图片识别失败。需要将GIF格式转为JPEG格式。代码，是找AI写的，记录一下： import java.awt.image.BufferedImage; import java.io.File; import java.io.IOException; im…...

编程日记 2024/12/21 19:19:04

基于DockerCompose搭建Redis主从哨兵模式

linux目录结构内网配置哨兵配置文件如下，创建3个哨兵配置文件 # sentinel26379.conf sentinel26380.conf sentinel26381.conf 内容如下 protected-mode no sentinel monitor mymaster redis-master 6379 2 sentinel down-after-milliseconds mymaster 60000 s…...

编程日记 2024/12/21 19:09:56

aioice里面candidate固定UDP端口测试

环境： aioice0.9.0 问题描述： aioice里面candidate固定UDP端口测试解决方案： /miniconda3/envs/nerfstream/lib/python3.10/site-packages/aioice import hashlib import ipaddress import random from typing import Optional import…...

编程日记 2024/12/21 19:06:53

Git使用教程-分支使用/合并分支提交

Git使用教程-分支使用文章目录 Git使用教程-分支使用一、分支（branch）的基本操作：二、查看分支：参考一、分支（branch）的基本操作： git clone https://.git git status …...

编程日记 2024/12/21 19:00:44

单元测试使用记录

什么是单元测试简单来说就是对一个类中的方法进行测试，对输出的结果检查判断是否符合预期结果但是在多年的工作中，从来没有哪个项目中真正系统的用到了单元测试，因此对它还是很陌生的，也就造成更加不会在项目中区使用它。如何…...

编程日记 2024/12/21 18:58:43

LabVIEW实时信号采集与频谱分析

系统通过LabVIEW与PXIe硬件结合，实现高精度模拟信号的实时采集、频谱分析与可视化显示。核心功能包括采样率配置、快速傅里叶变换（FFT）、功率谱图生成及动态缩放调整，同时支持信号平均与噪声抑制。系统设计灵活，适用于…...

编程日记 2024/12/21 18:57:41

OpenCV(python)从入门到精通——运算操作

加法减法操作 import cv2 as cv import numpy as npx np.uint8([250]) y np.uint8([10])x_1 np.uint8([10]) y_1 np.uint8([20])# 加法,相加最大只能为255 print(cv.add(x,y))# 减法，相互减最小值只能为0 print(cv.subtract(x_1,y_1))图像加法 import cv2 as…...

编程日记 2024/12/21 18:55:40

基础2：值类型与右值引用

1.函数返回在讲解右值之前，要知道下面这个函数要进行几次拷贝以及为什么？ int get_x() {int x 20;return x; }int aget_x(); 答案：两次 # 第一次 int tmpa; # 第二次 int xtmp;2.左值与右值 🍏2.1 能取地址操作的就是左值 …...

编程日记 2024/12/21 18:52:36

GitHub年度报告发布！Python首次超越JavaScript

全球开发者数量激增，GenAI 项目呈爆炸式增长趋势，推动编程语言的应用格局也发生了巨大变化，最新的 GitHub Octoverse 报告来了！ 1、Python 首次超越 JavaScript，成为 GitHub 平台最顶级编程语言不同于流传“AI 即将取…...

编程日记 2024/12/21 18:50:35

EdgeX Message Bus 消息总线

EdgeX Message Bus 消息总线一、概述 EdgeX MessageBus 内部消息总线，用于 EdgeX 服务之间的内部通信。 EdgeX 服务是指来自 EdgeX 的任何核心/支持/应用程序/设备服务或使用 EdgeX SDK 构建的任何自定义应用程序或设备服务。 EdgeX MessageBus 用于内部 EdgeX 服务与服务之间…...

编程日记 2024/12/21 18:49:33

【JavaEE进阶】关于Maven

目录 🌴什么是Maven 🌲为什么要学Maven 🎍创建一个Maven项目 🎄Maven核心功能 🚩项目构建 🚩依赖管理 🎋Maven Help插件 🍀Maven 仓库 🚩本地仓库 &#x1f6a…...

编程日记 2024/12/21 18:47:31

YOLOv9-0.1部分代码阅读笔记-autoanchor.py

autoanchor.py utils\autoanchor.py 目录 autoanchor.py 1.所需的库和模块 2.def check_anchor_order(m): 3.def check_anchors(dataset, model, thr4.0, imgsz640): 4.def kmean_anchors(dataset./data/coco128.yaml, n9, img_size640, thr4.0, gen1000, verboseTrue…...

编程日记 2024/12/21 18:45:29

Electronjs+Vue如何开发PC桌面客户端（Windows,Mac,Linux）

electronjs官网 https://www.electronjs.org/zh/ Electron开发PC桌面客户端的技术选型非常适合已经有web前端开发人员的团队。能够很丝滑的过渡。 Electron是什么？ Electron是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。嵌入 Chromium 和 Node.…...

编程日记 2024/12/21 18:42:25

谷歌浏览器安装谷歌浏览器特定版本后禁止自动更新

问题描述我们通过离线安装谷歌浏览器后，第一次打开浏览器时会默认下载最新版本，等到我们重启浏览器后它会自动更新。在项目中为了能固定浏览器版本，所以要禁止谷歌浏览器的更新，网上找了好多方法都没用，自己摸索出来…...

编程日记 2024/12/21 18:38:19

Linux计算时间差

Linux计算时间差 1、Linux计算时间差2、时间差的应用 1、Linux计算时间差在Linux中，计算时间差通常是为了统计、监控或调试。时间差可以用来衡量任务执行的时间，或者两个事件之间的间隔。例如，响应时间、执行时间、定时任务与延时处理等以…...

编程日记 2024/12/21 18:31:11

Python的3D可视化库【vedo】2-5 (plotter模块) 坐标转换、场景导出、添加控件

文章目录 4 Plotter类的方法4.7 屏幕和场景中的坐标点转换4.7.1 屏幕坐标转为世界坐标4.7.2 世界坐标转为屏幕坐标4.7.3 屏幕坐标取颜色 4.8 导出4.8.1 导出2D图片4.8.2 导出3D文件 4.9 添加控件4.9.1 添加内嵌子窗口4.9.2 添加选择区4.9.3 添加比例尺4.9.4 为对象添加弹出提示…...

编程日记 2024/12/21 18:29:09

【VUE】13、安装nrm管理多个npm源

nrm（npm registry manager）是一个 npm 源管理器，它允许用户快速地在不同的 npm 源之间进行切换，以提高包管理的速度和效率。以下是对 nrm 使用的详细介绍： 1、安装nrm 在使用 nrm 之前，需要先确保已经安装…...

编程日记 2024/12/21 18:26:06

【SQL/MySQL 如何使用三种触发器】SQL语句实例演示

触发器介绍 – 触发器是与表有关的数据库对象，指在insert/update/delete之前(BEFORE)或之后(AFTER)，触发并执行触发器中定义的SQL语句集合。 – 使用别名OLD和NEW来引用触发器中发生变化的记录内容，这与其他的数据库是相似的。现在触发器还只…...

编程日记 2024/12/21 18:24:04

Docker容器五种网络驱动模式详解

Docker 网络用于在容器之间以及容器与外部网络之间提供通信功能。它允许容器在隔离的网络环境中运行，同时也能根据需要与其他容器或外部网络进行交互。通过使用网络驱动，Docker 可以创建不同类型的网络，以满足各种应用场景的需求。传统上&am…...

编程日记 2024/12/21 18:17:56

netfilter简介及流程图

Netfilter 是 Linux 内核中用于网络包过滤和操作的框架，由 Rusty Russell 于1998年创立，旨在改进旧的 ipchains 和 ipfwadm 实现。它采用模块化设计，具有良好可扩展性，并在2000年3月合并进Linux 2.3.x内核版本。 Netfilter的主要…...

编程日记 2024/12/21 18:12:52

Vue 前端代码规范

在 Vue 前端开发中，遵循代码规范可以提高代码的可读性、可维护性和团队协作效率。以下是一些详细的 Vue 前端代码规范，涵盖了多个方面： ### 1. **项目结构** - **目录结构**:- src/ 目录下应包含 components/、views/、store/、router/、ass…...

编程日记 2024/12/21 18:10:50