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

HTML笔记（1）

news 2025/9/15 21:47:37

介绍

 

  • 浏览器中内置了HTML的解析引擎，通过解析标记语言来展现网页；
  • HTML标签都是预定义好的；
  • Java工程师：后台代码的编写，和数据库打交道，把数据给网页前端的工程师；
  • 网页前端工程师：写HTML页面，它们拿到数据就可以把数据展现到页面上，呈现给用户；
  • 两类人联合起来开发软件的系统
  • W3C是万维网联盟：它们是定义标准的一个组织，它们规定一个网页由三部分组成，这三部分是网页的结构、网页的表现、以及网页的行为；分别对应了三种不同的语言来去定义这三种不同的组成部分。

       HTML - 定义网页的结构

       CSS - 定义网页的表现

       JavaScript - 定义网页的行为

       这三种语言被称为网页前端三剑客

基础标签

创建网页项目

新建模块（项目）→ 选择创建路径 → 编辑名称 → 创建目录 → 编辑目录名称为html → 创建html文件

在IDEA（Java工程师用）

不需要src目录，把它删去

在WebStorm（前端工程师用）

细节

注意

· 回车、换行、空白字符等都是不被页面所识别的，如需换行需要手动添加<br>标签。

  • · html要显示特殊字符，需要用特殊的转义字符。

图片、音频、视频标签

其他的音视频格式html暂时不支持

资源路径

1、绝对路径：完整路径

2、相对路径：（两个资源的）相对位置关系（*当前页面访问的路径；*当前资源访问的路径）

        情况一：在同一目录下   ./a.jpg   或   a.jpg

        页面访问：xxx(访问项目，怎么写无所谓)/html/02-图片音频视频.html

        资源访问：xxx/html/a.jpg

        情况二：在同一目录下的其他目录中   ./img/a.jpg   或   img/a.jpg

        页面访问：xxx/html/02-图片音频视频.html

        资源访问：xxx/html/img/a.jpg

        情况三：资源所在的目录和页面所在的目录为同级   ../img/a.jpg

        页面访问：xxx/html/02-图片音频视频.html

        资源访问：xxx/img/a.jpg

        需要找到页面的上一级目录(html)，html目录和img目录在同一级，这时再通过img目录下找到资源(a.jpg)，所以要通过html文件找到资源，就要首先找到它的上一级（用../表示，就到了html目录），再找同级的img，再拿资源就可以了，也就是   ../img/a.jpg

        当资源改变路径时，webstorm会同步更改代码中引用的路径。

 

示例代码

总结

超链接标签

在页面内部跳转会用_self；跳转到新的页面会用_blank。

示例代码

相关文章：

HTML笔记（1）

介绍 浏览器中内置了HTML的解析引擎&#xff0c;通过解析标记语言来展现网页&#xff1b;HTML标签都是预定义好的&#xff1b;Java工程师&#xff1a;后台代码的编写&#xff0c;和数据库打交道&#xff0c;把数据给网页前端的工程师&#xff1b;网页前端工程师&#xff1a;写H…...

编程日记 2023/8/2 2:57:49

重新审视MHA与Transformer

本文将基于PyTorch源码重新审视MultiheadAttention与Transformer。事实上&#xff0c;早在一年前博主就已经分别介绍了两者&#xff1a;各种注意力机制的PyTorch实现、从零开始手写一个Transformer&#xff0c;但当时的实现大部分是基于d2l教程的&#xff0c;这次将基于PyTorch…...

编程日记 2023/8/2 2:56:47

Docker 全栈体系（七）

Docker 体系&#xff08;高级篇&#xff09; 五、Docker-compose容器编排 1. 是什么 Compose 是 Docker 公司推出的一个工具软件&#xff0c;可以管理多个 Docker 容器组成一个应用。你需要定义一个 YAML 格式的配置文件docker-compose.yml&#xff0c;写好多个容器之间的调…...

编程日记 2023/8/2 2:55:46

【编程范式】聊聊什么是数据类型和范式的本质

什么是编程范式 范式其实就是做事的方式&#xff0c;编程范式可以理解为如何编程&#xff0c;按照什么样的模式或者风格进行编程。 编程范式包含哪些 泛型编程函数式编程面向对象编程编程本质和逻辑编程 虽然有不同的编程范式&#xff0c;但是对于目的来说都是为了解决同一…...

编程日记 2023/8/2 2:54:45

2023-08-01 python根据x轴、y轴坐标（数组）在坐标轴里画出曲线图，python 会调用鼎鼎大名的matlib，用来分析dac 数据

一、python 源码如下 import numpy as np import matplotlib as mpl import matplotlib.pyplot as plt#x[0 ,1,2,3,5,6,10] #y[0,0,3,4,5,7,8]# { 0 , 1 , 0x0003 },// 0 # { 0XFFFF * 1 / 10 , 3006 , 0x0a6b },// 1 # { 0XFFFF * 2 / 10 , 599…...

编程日记 2023/8/2 2:53:43

小研究 - 主动式微服务细粒度弹性缩放算法研究（四）

微服务架构已成为云数据中心的基本服务架构。但目前关于微服务系统弹性缩放的研究大多是基于服务或实例级别的水平缩放&#xff0c;忽略了能够充分利用单台服务器资源的细粒度垂直缩放&#xff0c;从而导致资源浪费。为此&#xff0c;本文设计了主动式微服务细粒度弹性缩放算法…...

编程日记 2023/8/2 2:52:41

机器学习深度学习——softmax回归的简洁实现

&#x1f468;‍&#x1f393;作者简介&#xff1a;一位即将上大四&#xff0c;正专攻机器学习的保研er &#x1f30c;上期文章&#xff1a;机器学习&&深度学习——softmax回归从零开始实现 &#x1f4da;订阅专栏&#xff1a;机器学习&&深度学习 希望文章对你…...

编程日记 2023/8/2 2:51:38

CPU利用率过高解决思路

文章目录 问题场景问题定位问题解决 本文参考&#xff1a; Linux服务器之CPU过高解决思路_linux cpu温度过高_Jeremy_Lee123的博客-CSDN博客 Java程序员必备&#xff1a;jstack命令解析 - 掘金 (juejin.cn) 重点问题&#xff01;CPU利用率过高排查思路&#xff5c;原创 (qq.…...

编程日记 2023/8/2 2:50:37

Redis（三）—— Redis基本的事务操作、Redis实现乐观锁

一、Redis基本的事务操作 首先声明&#xff1a; redis的单条命令是保证原子性的&#xff08;回想一下setnx k1 v1 k5 v5命令如果k1已经存在&#xff0c;那么k5也会设置失败&#xff09;但是redis的事务不保证原子性&#xff01;见下面“1.2 某条命令有错怎么办&#xff1f;”…...

编程日记 2023/8/2 2:49:36

SQLI_LABS攻击

目录 Less1 首先来爆字段 联合注入 判断注入点 爆数据库名 爆破表名 information_schema information_schmea.tables group_concat() 爆破列名 information_schema.columns 爆值 SQLMAP Less-2 -4 Less -5 布尔 数据库 表名 字段名 爆破值 SQLMAP Less-6 …...

编程日记 2023/8/2 2:48:33

如何查看 Chrome 网站有没有前端 JavaScript 报错？

您可以按照以下步骤在Chrome中查看网站是否存在前端JavaScript报错&#xff1a; 步骤1&#xff1a;打开Chrome浏览器并访问网站 首先&#xff0c;打开Chrome浏览器并访问您想要检查JavaScript报错的网站。 步骤2&#xff1a;打开开发者工具 在Chrome浏览器中&#xff0c;按…...

编程日记 2023/8/2 2:47:32

JS前端读取本地上传的File文件对象内容（包括Base64、text、JSON、Blob、ArrayBuffer等类型文件）

读取base64图片File file2Base64Image(file, cb) {const reader new FileReader();reader.readAsDataURL(file);reader.onload function (e) {cb && cb(e.target.result);//即为base64结果}; }, 读取text、JSON文件File readText(file, { onloadend } {}) {const re…...

编程日记 2023/8/2 2:46:31

【项目方案】OpenAI流式请求实现方案

文章目录 实现目的效果比对非stream模式stream模式实现方案方案思路总体描述前端方案对比event-source-polyfill代码示例前端实现遇到的问题与解决方法后端参考资料时序图关键代码示例后端实现时遇到的问题与解决方法实现目的 stream是OpenAI API中的一个参数，用于控制请求的…...

编程日记 2023/8/2 2:45:26

华为数通HCIP-IP组播基础

点到点业务&#xff1a;比如FTP&#xff0c;WEB业务&#xff0c;此类业务主要特点是不同的用户有不同的需求&#xff0c;比如用户A需要下载资料A&#xff0c;用户B需要下载资料B。此类业务一般由单播承载&#xff0c;服务器对于不同用户发送不同的点到点数据流。 ospf、isis…...

编程日记 2023/8/2 2:44:25

STM32 SPI学习

SPI 串行外设设备接口&#xff08;Serial Peripheral Interface&#xff09;&#xff0c;是一种高速的&#xff0c;全双工&#xff0c;同步的通信总线。 SCK时钟信号由主机发出。 SPI接口主要应用在存储芯片。 SPI相关引脚&#xff1a;MOSI&#xff08;输出数据线&#xff…...

编程日记 2023/8/2 2:43:23

分布式缓存与数据库的一致性记录

用户更新数据库&#xff0c;需要再去更新redis缓存&#xff0c;否则会造成缓存与数据库数据不一致 一致性的两种方法 1). 双写模式 更新完数据库之后&#xff0c;更新redis缓存数据 问题: 因为请求时间的问题&#xff0c;造成缓存数据不是最新的 数据。 原因&#xff1a;A先修…...

编程日记 2023/8/2 2:42:21

vue3的语法

main.js中写发生变化&#xff0c;并不兼容vue2的写法 //vue3 import { createApp } from vue import ./style.css import App from ./App.vuecreateApp(App).mount(#app)//vue2 import Vue from vue import ./style.css import App from ./App.vueconst vm new Vue({render:h…...

编程日记 2023/8/2 2:41:19

【git合并分支自定义提交消息】

开发分支 dev主分支 master 需求 dev分支开发完后合并到master分支自定义提交信息 通过 git merge dev --squash --no-commit此命令会拉取dev分支代码到当前分支&#xff0c;并不会自动提交&#xff0c;可以自己修改提交信息...

编程日记 2023/8/2 2:40:15

AttributeError: module ‘PyQt5.QtGui‘ has no attribute ‘QMainWindow‘

场景描述&#xff1a; 这个问题是使用PyUIC将ui文件变成py文件后遇到的 解决办法&#xff1a; 改动1&#xff1a;把object改成QtWidgets.QMainWindow 改动2&#xff1a;增加__init__函数&#xff0c;函数结构如下&#xff1a; def __init__(self):super(Ui_MainWindow,self).…...

编程日记 2023/8/2 2:39:12

基于Java+SpringBoot+Vue前后端分离电商项目

晚间lucky为友友们送福利啦~&#x1f381; Tips&#xff1a;有需要毕业设计指导的童鞋一定要认真看哦&#xff0c;文末有彩蛋。 一.项目介绍 该电商项目是一个简单、入门级的电商项目&#xff0c;是基于JavaSpringBootVue前后端分离项目。前端采用两套独立的系统分别完成项目…...

编程日记 2023/8/2 2:38:10

微信小程序之bind和catch

这两个呢&#xff0c;都是绑定事件用的&#xff0c;具体使用有些小区别。 官方文档&#xff1a; 事件冒泡处理不同 bind&#xff1a;绑定的事件会向上冒泡&#xff0c;即触发当前组件的事件后&#xff0c;还会继续触发父组件的相同事件。例如&#xff0c;有一个子视图绑定了b…...

编程新知 2025/9/12 22:08:01

云计算——弹性云计算器（ECS）

弹性云服务器&#xff1a;ECS 概述 云计算重构了ICT系统&#xff0c;云计算平台厂商推出使得厂家能够主要关注应用管理而非平台管理的云平台&#xff0c;包含如下主要概念。 ECS&#xff08;Elastic Cloud Server&#xff09;&#xff1a;即弹性云服务器&#xff0c;是云计算…...

编程新知 2025/8/16 21:50:27

vue3 字体颜色设置的多种方式

在Vue 3中设置字体颜色可以通过多种方式实现&#xff0c;这取决于你是想在组件内部直接设置&#xff0c;还是在CSS/SCSS/LESS等样式文件中定义。以下是几种常见的方法&#xff1a; 1. 内联样式 你可以直接在模板中使用style绑定来设置字体颜色。 <template><div :s…...

编程新知 2025/8/22 4:33:54

c#开发AI模型对话

AI模型 前面已经介绍了一般AI模型本地部署&#xff0c;直接调用现成的模型数据。这里主要讲述讲接口集成到我们自己的程序中使用方式。 微软提供了ML.NET来开发和使用AI模型&#xff0c;但是目前国内可能使用不多&#xff0c;至少实践例子很少看见。开发训练模型就不介绍了&am…...

编程新知 2025/8/6 7:59:50

selenium学习实战【Python爬虫】

selenium学习实战【Python爬虫】 文章目录 selenium学习实战【Python爬虫】一、声明二、学习目标三、安装依赖3.1 安装selenium库3.2 安装浏览器驱动3.2.1 查看Edge版本3.2.2 驱动安装 四、代码讲解4.1 配置浏览器4.2 加载更多4.3 寻找内容4.4 完整代码 五、报告文件爬取5.1 提…...

编程新知 2025/9/13 0:07:56

Selenium常用函数介绍

目录 一&#xff0c;元素定位 1.1 cssSeector 1.2 xpath 二&#xff0c;操作测试对象 三&#xff0c;窗口 3.1 案例 3.2 窗口切换 3.3 窗口大小 3.4 屏幕截图 3.5 关闭窗口 四&#xff0c;弹窗 五&#xff0c;等待 六&#xff0c;导航 七&#xff0c;文件上传 …...

编程新知 2025/9/3 20:57:36

GitHub 趋势日报 (2025年06月06日)

&#x1f4ca; 由 TrendForge 系统生成 | &#x1f310; https://trendforge.devlive.org/ &#x1f310; 本日报中的项目描述已自动翻译为中文 &#x1f4c8; 今日获星趋势图 今日获星趋势图 590 cognee 551 onlook 399 project-based-learning 348 build-your-own-x 320 ne…...

编程新知 2025/9/7 2:12:04

【MATLAB代码】基于最大相关熵准则（MCC）的三维鲁棒卡尔曼滤波算法（MCC-KF），附源代码|订阅专栏后可直接查看

文章所述的代码实现了基于最大相关熵准则（MCC）的三维鲁棒卡尔曼滤波算法（MCC-KF），针对传感器观测数据中存在的脉冲型异常噪声问题，通过非线性加权机制提升滤波器的抗干扰能力。代码通过对比传统KF与MCC-KF在含异常值场景下的表现，验证了后者在状态估计鲁棒性方面的显著优…...

编程新知 2025/9/9 22:21:42

前端中slice和splic的区别

1. slice slice 用于从数组中提取一部分元素&#xff0c;返回一个新的数组。 特点&#xff1a; 不修改原数组&#xff1a;slice 不会改变原数组&#xff0c;而是返回一个新的数组。提取数组的部分&#xff1a;slice 会根据指定的开始索引和结束索引提取数组的一部分。不包含…...

编程新知 2025/6/20 15:06:56

API网关Kong的鉴权与限流：高并发场景下的核心实践

&#x1f525;「炎码工坊」技术弹药已装填&#xff01; 点击关注 → 解锁工业级干货【工具实测|项目避坑|源码燃烧指南】 引言 在微服务架构中&#xff0c;API网关承担着流量调度、安全防护和协议转换的核心职责。作为云原生时代的代表性网关&#xff0c;Kong凭借其插件化架构…...

编程新知 2025/9/6 9:35:29