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

前端

前端页面

Web页面

PC端程序页面

移动端APP页面

...

 HTML页面

HTML超文本标记页面

超文本:文本,声音,图片,视频,表格,链接

标记:由许多标签组成

HTML页面运行到浏览器上面

vscode便捷插件使用

vscode运行

自动刷新页面

<!DOCTYPE html>//指定当前html版本5
<html lang="en">//指定当前页面内容为英文<head><meta charset="UTF-8">//浏览器解码规则<meta http-equiv="X-UA-Compatible" content="IE=edge">//IE浏览器渲染效果按照IE浏览器最高版本展示<meta name="viewport" content="width=device-width, initial-scale=1.0">//移动端适配<title>hello</title>
</head><body>hello world
</body></html>

html:html文件根标签

head:编写页面相关的属性

title:页面标题

body:页面内容展示信息 

head和body是兄弟标签

head和title是父子标签

html

标签&标题&段落&换行&注释

注释

<!-- 这是注释 -->//ctrl+/

标题标签

<h1></h1>

<h2></h2>

...

<h6></h6>

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>这是页面标签</title>
</head><body><h1>这是h1标签</h1><h2>这是h2标签</h2><h3>这是h3标签</h3><h4>这是h4标签</h4><h5>这是h5标签</h5><h6>这是h6标签</h6>
</body></html>

段落标签

<p></p>每行存在可察的间隙

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>这是页面标签</title>
</head><body><p>对于初次接触Bonsai CSS的新手来说,建议按照官方文档中的指导逐步操作,确保所有依赖项都已正确安装,并验证工具链是否正常工作1。</p><p>使用CSS Hooks管理样式表,CSS Hooks提供了简化的方式去管理和增强CSS的功能当面对环境配置难题时,应仔细检查Node.js版本以及npm包管理器的状态,确认它们满足最低要求后再继续其他步骤2。</p><p>掌握基本的CSS布局原理,理解CSS布局的核心在于掌握如何定义元素尺寸(宽度/高度)及其定位方式(浮动、绝对定位等)。</p>
</body></html>

换行标签

<br>或者</br>实现段落换行,间隙小于段落间隙

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>这是页面标签</title>
</head><body><p>对于初次接触Bonsai CSS的新手来说,建议按照官方文档中的指导逐步操作,确保所有依赖项都已正确安装,并验证工具链是否正常工作1。</p><p>使用CSS Hooks管理样式表,,<br>CSS Hooks提供了简化的方式去管理和增强CSS的功能当面对环境配置难题时,应仔细<br>检查Node.js版本以及npm包管理器的状态,确认它们满足最低要求后再继续其他步骤2。</p><p>掌握基本的CSS布局原理,理解CSS布局的核心在于掌握如何定义元素尺寸(宽度/高度)及其定位方式(浮动、绝对定位等)。</p>
</body></html>

标签(加粗&倾斜&删除线&下划线)

加粗:strong ,b

倾斜:em ,i

删除线:del ,s

下划线:ins ,u

(前者起强调作用)

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>这是页面标签</title>
</head><body><p>对于初次接触<strong>Bonsai</strong>CSS的新手来说,<b>建议按照<s>官方文档</s>中的指导逐步操作</b>,确保所有<ins>依赖项</ins>都已正确安装,并验证工具链是否<u>正常</u>工作1。</p><br>使用CSS Hooks管理样式表,,</br>CSS Hooks提供了简化的方式去管理和增强CSS的功能当面对环境配置难题时,应仔细<br>检查Node.js版本以及npm包管理器的状态,确认它们满足最低要求后再继续其他步骤2。</p><p>掌握基本的<em>CSS布局原理</em>,理解CSS布局的核心在于<i>掌握如何定义元素尺寸</i>(宽度/高度)及<del>其定位方式(浮动、绝对定位等)</del>。</p>
</body></html>

图像 (src&title&alt&height/weight&border)

img标签_src属性

<img src="./baidu.png">

img标签必须搭配src使用(指定图片路径)

绝对路径       

        图片路径

        网络上的图片资源

相对路径

        ./xxx.png(当前路径)

        ./img/xxx.png(某个文件夹下)

        ../xxx.png(上一层路径)

本地图片插入 

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>这是页面标签</title>
</head><body><p>对于初次接触<strong>Bonsai</strong>CSS的新手来说,<b>建议按照<s>官方文档</s>中的指<img src="./baidu.png"></b>,确保所有<ins>依赖项</ins>都已正确安装,并验证工具链是否<u>正常</u>工作1。</p><br>使用CSS Hooks管理样式表,,</br>CSS Hooks提供了简化的方式去管理和增强CSS的功能当面对环境配置难题时,应仔细<br>检查Node.js版本以及npm包管理器的状态,确认它们满足最低要求后再继续其他步骤2。</p><p>掌握基本的<em>CSS布局原理</em>,理解CSS布局的核心在于<i>掌握如何定义元素尺寸</i>(宽度/高度)及<del>其定位方式(浮动、绝对定位等)</del>。</p>
</body></html>

 网络图片插入

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>这是页面标签</title>
</head><body><p>对于初次接触<strong>Bonsai</strong>CSS的新手来说,<b>建议按照<s>官方文档</s>中的指<img src="./baidu.png"></b>,确保所有<ins>依赖项</ins>都已正确安装,并验证工具链是否<u>正常</u>工作1。</p><br>使用CSS Hooks管理样式表,,</br>CSS Hooks提供了简化的方式去管理和增强CSS的功能当面对环境配置难题时,应仔细<br>检查Node.js版本以及npm包管理器的状态,确认它们满足最低要求后再继续其他步骤2。</p><p>掌握基本的<em>CSS布局原理</em>,理解<imgsrc="https://www.keaitupian.cn/cjpic/frombd/2/253/1659552792/3869332496.jpg"><i>掌握如何定义元素尺寸</i>(宽度/高度)及<del>其定位方式(浮动、绝对定位等)</del>。</p>
</body></html>

 img标签_alt属性

<img src=" "  alt="图片加载失败..."   border="1px" width="100px" height="100px">

alt:替换文本,当文本不能正确显示时,会显示一个替换的文字

title:提示文本,鼠标放到图片上,就会有提示

width/height:控制宽度高度,高度和宽度一般该一个就行,另外一个会等比例缩放,否则图片会失衡

border:边框,参数是宽度的像素,但是一般使用css设定 

 

超链接标签

a_herf&a_target

<a href=" " target=" "></a>

href:必须具备,表示点击会跳转到哪个页面

target:打开方式,默认是_self. 如果是_blank 则用新的标签打开

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><a href="https://www.baidu.com/">跳转到百度</a><a href="20241225.html">跳转到html页面</a><a href="#">在当前页面</a><a href="https://www.baidu.com/"><img src="baidu.png" alt="" title="跳转到百度"></a>
</body></html>

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>这是页面标签</title>
</head><body><p>对于初次接触<strong>Bonsai</strong>CSS的新手来说,<b>建议按照<s>官方文档</s>中的指<img src="./baidu.png" title="这是一张百度图片"border="2px"></b>,确保所有<ins>依赖项</ins>都已正确安装,并验证工具链是否<u>正常</u>工作1。</p><br>使用CSS Hooks管理样式表,,</br>CSS Hooks提供了<ahref="https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=39042058_26_oem_dg&wd=%E7%99%BE%E5%BA%A6&oq=%25E6%25AD%25B9%25E6%25AF%2592&rsv_pq=c049e1db002d548f&rsv_t=d34dAccK%2BMxkf%2Bu6RAUck6LsIGwU3XAhvhXOF0K3mxNmrBu7Z6jtUQdO4SYLYJD%2BbePlATiDQ6EL&rqlang=cn&rsv_dl=tb&rsv_sug3=8&rsv_enter=1&rsv_sug1=6&rsv_sug7=100&rsv_sug2=0&rsv_btype=t&inputT=1164&rsv_sug4=2928"target="https://www.baidu.com/">简化的方式去管理和增强</a><br>检查Node.js版本以及npm包管理器的状态,确认它们满足最低要求后再继续其他步骤2。</p><p>掌握基本的<em>CSS布局原理</em>,理解<img src="https://www.keaitupian.cn/cjpic/fombd/2/253/1659552792/3869332496.jpg"alt="图片加载失败..."><i>掌握如何定义元素尺寸</i>(宽度/高度)及<del>其定位方式(浮动、绝对定位等)</del>。</p>
</body></html>

表格(table&tr&td&th&thead)(&align&border&cellpadding&cellspacing&width/height)

table:表示整个表格

tr:表示表格的一行

td:表示一个单元格

th:表示表头单元格,会居中加粗

thead:表格的头部区域(注意和th区分,范围是比th要大的)

                (thead里面的内容居中+加粗显示)

align:十单元格相对于周围元素的对齐方式. align="center"(不是内部元素的对齐方式)

border:表示边框,1表示有边框(数字越大,边框越粗)," "表示没边框

cellpadding:内容距离边框的距离,默认1像素

cellspacing:单元格之间的距离,默认是2像素

width/height:设置尺寸

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><table border="1" width="500px" height="300px" cellspacing="0"><tr align="center"><td>姓名</td><td>性别</td><td>年龄</td></tr><tr align="center"><td>张三</td><td>男</td><td>3</td></tr><tr align="center"><td>李四</td><td>男</td><td>4</td></tr><tr align="center"><td>王五</td><td>女</td><td>5</td></tr></table>
</body></html>

 

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><table border="1" width="500px" height="300px" cellspacing="0"><thead><tr align="center"><th>姓名</th><th>性别</th><th>年龄</th></tr></thead><tr align="center"><td>张三</td><td>男</td><td>3</td></tr><tr align="center"><td>李四</td><td>男</td><td>4</td></tr><tr align="center"><td>王五</td><td>女</td><td>5</td></tr></table>
</body></html>

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><table border="1" width="500px" height="300px" cellspacing="0"><thead><tr align="center"><th>姓名</th><th>性别</th><th>年龄</th></tr></thead><tr align="center"><td>姓名</td><td>性别</td><td>年龄</td></tr><tr align="center"><td>张三</td><td>男</td><td>3</td></tr><tr align="center"><td>李四</td><td>男</td><td>4</td></tr><tr align="center"><td>王五</td><td>女</td><td>5</td></tr></table>
</body></html>

格式书写

<thead></thead>

<tbody></tbody> 

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><table border="1" width="500px" height="300px" cellspacing="0"><thead><tr align="center"><th>姓名</th><th>性别</th><th>年龄</th></tr></thead><tbody><tr align="center"><td>张三</td><td>男</td><td>3</td></tr><tr align="center"><td>李四</td><td>男</td><td>4</td></tr><tr align="center"><td>王五</td><td>女</td><td>5</td></tr></tbody></table>
</body></html>
合并单元格(水平/竖直)

rowspan=" "(竖直方向上)

colspan=" "(水平方向)

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><table border="1" width="500px" height="300px" cellspacing="0"><thead><tr align="center"><th>姓名</th><th>性别</th><th>年龄</th></tr></thead><tbody><tr align="center"><td>姓名</td><td>性别</td><td>年龄</td></tr><tr align="center"><td>张三</td><td rowspan="2">男</td><td>3</td></tr><tr align="center"><td>李四</td><!-- <td>男</td> --><td>4</td></tr><tr align="center"><td colspan="2">王五/女</td><!-- <td>女</td> --><td>5</td></tr></tbody></table>
</body></html>

列表

无序列表(ul&li)
type属性

disc:实心圆(浏览器默认展示方式)

square:实心方块

circle:空心圆

快捷键

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><h1>这是一个无序列表</h1><ul><li>这是内容1</li><li>这是内容2</li><li>这是内容3</li></ul>
</body></html>

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><h1>这是一个无序列表</h1><ul type="circle"><li>这是内容1</li><li>这是内容2</li><li>这是内容3</li></ul>
</body></html>

 

有序列表(ol&li)
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><h1>这是一个无序列表</h1><ul type="circle"><li>这是内容1</li><li>这是内容2</li><li>这是内容3</li></ul><h1>这是一个有序列表</h1><ol><li>这是有序列表1</li><li>这是有序列表2</li><li>这是有序列表3</li><li>这是有序列表4</li></ol>
</body></html>

type&start属性

type=" "

start=" "

<h1>这是一个有序列表</h1><ol type="A" start="3"><li>这是有序列表1</li><li>这是有序列表2</li><li>这是有序列表3</li><li>这是有序列表4</li></ol>

自定义列表(dl&dt&dd)
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><h1>这是一个无序列表</h1><ul type="circle"><li>这是内容1</li><li>这是内容2</li><li>这是内容3</li></ul><h1>这是一个有序列表</h1><ol type="A" start="3"><li>这是有序列表1</li><li>这是有序列表2</li><li>这是有序列表3</li><li>这是有序列表4</li></ol><h1>这是一个自定义列表</h1><dl><dt>自定义列表显示内容<dd>自定义列表内容1</dd><dd>自定义列表内容2</dd><dd>自定义列表内容3</dd></dt></dl>
</body></html>

表单(input&form&label&select)

表单标签完成服务器的一次交互

表单域:包含表单元素的区域,重点是form标签  <form action=""></form>

表单控件:输入框,提交按钮,重点是input标签(必须搭配表单域完成)

可以通过对type进行对应的取值,来控制input类型

 input

文本框<input type="text">    单行输入

密码框<input type="password">

单选框<input type="radio" name="sex" checked="checked">(name相同时只能点中一个)(checked="checked"标记性别默认为该值)

复选框<input type="checkbox">

普通按钮<input type="button" value="我是个按钮" οnclick="alert('hello')">(onclick表示点击出现什么反应)

提交按钮<input type="submit">

清空按钮<input type="reset">

提交文件<input type="file">

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><form action="">姓名:<input type="text"><br>密码:<input type="password"><br>性别:<input type="radio" name="sex">男<input type="radio" name="sex" checked="checked">女<br>爱好:<input type="checkbox">吃饭<input type="checkbox">睡觉<input type="checkbox">玩游戏<br><input type="button" value="我是个按钮" onclick="alert('hello')"><input type="submit"><input type="reset"><input type="file"></form>
</body></html>

提交 

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><form action="https://www.baidu.com/">课程:<input type="text" name="course"><input type="submit"></form>
</body></html>

label

 <label for="male">男</label>
  <input type="radio" name="sex" id="male">

<body><input type="radio" name="sex">男<input type="radio" name="sex">女//点击按钮才能选中
</body>

<body><label for="male">男</label><input type="radio" name="sex" id="male"><label for="female">女</label><input type="radio" name="sex" id="female">//点击文字也可选中
</body>

select(默认展示第一个)

<select name="" id="">
    <option value="" selected="selected"></option>
  </select>

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><label for="male">男</label><input type="radio" name="sex" id="male"><label for="female">女</label><input type="radio" name="sex" id="female"><select name="" id=""><option value="">---请选择年份---</option><option value="">---1991---</option><option value="">---1992---</option><option value="">---1993---</option><option value="">---1994---</option></select>
</body></html>

<select name="" id=""><option value="">---请选择年份---</option><option value="" selected="selected">---1991---</option>//展示该选项<option value="">---1992---</option><option value="">---1993---</option><option value="">---1994---</option></select>

textarea(内容框)

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

无语义标签(div&span)

没有固定的用途

div 是独占一行的,是一个大盒子

span 不占一行,是一个小盒子

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><div><div><span>吃饭</span><span>睡觉</span><span>玩游戏</span></div><div><div>吃饭</div><div>睡觉</div><div>玩游戏</div></div></div>
</body></html>

实践项目---简历书写

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><h1>某某某</h1><div><h2>基本信息</h2><img src="yy.jpg" alt="" width="200" height="200"><span><p>求职意向:Java开发</p></span><span><p>联系电话:xxx-xxx-xxx</p></span><span><p>个人邮箱:xxx-xxx@163.com</p></span><span><p><a href="https://gitee.com/">我的Gitee</a></p></span><span><p><a href="https://csdnnews.blog.csdn.net/article/details/130333678?spm=1000.2115.3001.5927">我的博客</a></p></span></div><div><h2>教育背景</h2><ol><li>小学</li><li>初中</li><li>高中</li><li>大学</li></ol></div><div><h2>专业技能</h2><ul><li>掌握Java编程</li><li>掌握数据结构</li><li>掌握前端相关技能,html,css,JavaScript</li></ul></div><div><h2>个人项目</h2><ol><h3><li>留言墙</li></h3><p>开发时间:2023年4月1日~2023年4月28日</p><p>功能介绍</p><ul><li>支持留言发布</li><li>支持匿名留言</li></ul></ol><ol><h3><li>学习小助手</li></h3><p>开发时间:2023年5月1日~2023年5月28日</p><p>功能介绍</p><ul><li>错词检测</li><li>支持同学探讨</li></ul></ol></div><div><h2>个人评价</h2><p>热爱生活,热爱编程</p></div>
</body></html>

个人简历页面填写

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><table><thead><h2>请填写简历信息</h2></thead><tbody><tr><td>姓名</td><td><input type="text"></td></tr><tr><td>性别</td><td><input type="radio" id="male" name="sex"><label for="male">男</label><input type="radio" id="female" name="sex"><label for="female">女</label></td></tr><tr><td>出生日期</td><td><select name="" id=""><option value="" selected="selected">---请选择年份---</option><option value="">---2004---</option><option value="">---2005---</option><option value="">---2006---</option><option value="">---2007---</option></select><select name="" id=""><option value="">---请选择月份---</option><option value="">---1月---</option><option value="">---2月---</option><option value="">---3月---</option><option value="">---4月---</option><option value="">---5月---</option><option value="">---7月---</option><option value="">---8月---</option><option value="">---9月---</option><option value="">---10月---</option><option value="">---11月---</option><option value="">---12月---</option></select><select name="" id=""><option value="">---请选择日期---</option><option value="">---1号---</option><option value="">---2号---</option><option value="">---3号---</option><option value="">---4号---</option><option value="">---5号---</option><option value="">---6号---</option></select></td></tr><tr><td>就读学校</td><td><input type="text"></td></tr><tr><td>应聘岗位</td><td><input type="checkbox">前端开发<input type="checkbox">后端开发<input type="checkbox">测试开发<input type="checkbox">运维开发</td></tr><tr><td>掌握的技能</td><td><textarea name="" id="" cols="30" rows="10"></textarea></td></tr><tr><td>项目经历</td><td><textarea name="" id="" cols="30" rows="10"></textarea></td></tr><tr><td></td><td><input type="checkbox">我已仔细阅读过公司的招牌要求</td></tr><tr><td></td><td><a href="https://www.baidu.com/">查看我的状态</a></td></tr><tr><td></td><td><h3>请应聘者确认:</h3></td></tr><tr><td></td><td><ul><li>以上信息真实有效</li><li>能够尽早去公司实习</li><li>能接受公司的加班文化</li></ul></td></tr></tbody></table>
</body></html>

相关文章:

前端

前端页面 Web页面 PC端程序页面 移动端APP页面 ... HTML页面 HTML超文本标记页面 超文本&#xff1a;文本&#xff0c;声音&#xff0c;图片&#xff0c;视频&#xff0c;表格&#xff0c;链接 标记&#xff1a;由许多标签组成 HTML页面运行到浏览器上面 vscode便捷插件使用 vs…...

【Git】—— 使用git操作远程仓库(gitee)

目录 一、远程仓库常用命令 1、从远程仓库克隆项目 2、查看关联的远程仓库 3、添加关联的远程仓库 4、移除关联的远程仓库 5、将本地仓库推送到远程仓库 6、从远程仓库拉取项目 二、分支命令 1、查询分支 2、创建分支 3、切换分支 4、推送到远程分支 5、合并分支 …...

Paddler负载均衡器

Paddler负载均衡器 Paddler本身是用Go语言编写的,没有直接的Python接口,但可以通过以下方式在Python中使用: 执行命令行调用 在Python中可以使用 subprocess 模块来调用Paddler的命令行工具,实现负载均衡功能 。例如: import subprocessdef start_paddler_agent():com…...

OSCP - Proving Grounds - Slort

主要知识点 文件包含 windows的reveseshell 具体步骤 执行nmap,依旧是很多端口开放&#xff0c;尝试了ftp,smb等均失败 Starting Nmap 7.94SVN ( https://nmap.org ) at 2024-10-13 12:00 UTC Nmap scan report for 192.168.53.53 Host is up (0.00095s latency). Not sho…...

YoloV9改进策略:Head改进|DynamicHead,利用注意力机制统一目标检测头部|即插即用

摘要 论文介绍 本文介绍了一种名为DynamicHead的模块,该模块旨在通过注意力机制统一目标检测头部,以提升目标检测的性能。论文详细阐述了DynamicHead的工作原理,并通过实验证明了其在COCO基准测试上的有效性和效率。 创新点 DynamicHead模块的创新之处在于它首次尝试在一…...

BFD综合详细实验配置案例

前言 本实验的目的是通过配置BGP&#xff08;边界网关协议&#xff09;、OSPF&#xff08;开放式最短路径优先协议&#xff09;、VRRP&#xff08;虚拟路由冗余协议&#xff09;以及BFD&#xff08;双向转发检测&#xff09;等网络协议&#xff0c;模拟企业级网络环境中的多协…...

自然语言处理与知识图谱的融合与应用

目录 前言1. 知识图谱与自然语言处理的关系1.1 知识图谱的定义与特点1.2 自然语言处理的核心任务1.3 二者的互补性 2. NLP在知识图谱构建中的应用2.1 信息抽取2.1.1 实体识别2.1.2 关系抽取2.1.3 属性抽取 2.2 知识融合2.3 知识推理 3. NLP与知识图谱融合的实际应用3.1 智能问答…...

c# RSA加解密工具,.netRSA加解密工具

软件介绍 名称: c# RSA加解密工具,.netRSA加解密工具依赖.net版本: .net 8.0工具类型: WinForm源码下载 c# RSA加解密工具,.netRSA加解密工具 依赖项 WinFormsRSA.csproj <Project...

Metricbeat安装教程——Linux——Metricbeat监控ES集群

Metricbeat安装教程——Linux 一、安装 下载安装包&#xff1a; 官网下载地址&#xff1a;https://www.elastic.co/cn/downloads/beats/metricbeat 上传包到linux 切换到安装目录下 解压&#xff1a;tar -zxvf metricbeat-7.17.1-linux-x86_64.tar.gz 重命名安装文件夹 mv met…...

一万多字拆解java中——“ 注解 ”的一切(三)(已完结)

前言&#xff1a; 咱们书接上回&#xff0c;上次按照框架讲了 第一篇&#xff0c;我们讲到了&#xff1a; ①注解的引入&#xff08;简单概述&#xff09;&#xff1a;在jdk5.0的时候 ②注解与注释的区别&#xff1a; 注释 是为了帮助人类阅读代码&#xff0c;不会对程序的执…...

记一次rac故障原因分析(虚拟化平台)

一 现象描述 XX客户于1月14号凌晨业务中断&#xff0c;检查数据库发现数据库集群宕机。 XX客户于2月14号春节初五早上业务异常&#xff0c;连接数据库无响应。 二 问题详细诊断 1月14号故障 1月14号凌晨2点&#xff0c;客户反馈业务中断&#xff0c;发现节点1无法连接&…...

Vue CLI 3 项目构建

Vue CLI 是一个功能强大、易于使用的工具&#xff0c;可以极大地简化 Vue.js 应用的开发过程。通过快速创建项目、灵活的插件系统和丰富的配置选项&#xff0c;开发者可以更专注于业务逻辑&#xff0c;而不是底层配置。无论是新手还是经验丰富的开发者&#xff0c;Vue CLI 都是…...

1114 Family Property (25)

This time, you are supposed to help us collect the data for family-owned property. Given each persons family members, and the estate&#xff08;房产&#xff09;info under his/her own name, we need to know the size of each family, and the average area and n…...

详细介绍Sd-WebUI提示词的语法规则

AI绘画中最大的门槛就是提示词&#xff0c;对英语水平、文学水平、想象力、灵感等要求较高。不能每次一输入正向提示词&#xff08;positive prompt&#xff09;&#xff0c;就只会写a girl, big eyes, red hair。虽然sd-webui软件可以直接翻译&#xff0c;输入一个子母后会立刻…...

document.body为null问题

调用document.body.append方法出现null的问题&#xff0c;一看就是放在了head中&#xff0c;一种方案是放在最后面&#xff0c;要不就和jquery一样监听&#xff0c;下面是代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8…...

2024国赛A问题5

问题五 龙头最大速度优化模型的建立 问题五在问题四的曲线的基础上对速度进行了约束&#xff0c;即在逐步改变龙头速度的情况下&#xff0c;各个龙身的速度也会依次改变&#xff0c;给出龙头的最大行进速度,使得舞龙队各把手的速度均不超过 2 m/s。即可依此构建一个龙头速度的…...

Kalilinux下MySQL的安装

MySQL是一个广泛使用的开源关系型数据库管理系统&#xff0c;它是最流行的关系型数据库之一。在Kalilinux下安装MySQL可以为我们提供方便的数据库管理和开发环境。本文将介绍如何在Kalilinux中安装MySQL&#xff0c;并提供一些常用的代码示例。 步骤一&#xff1a;更新软件包 …...

文件路径与Resource接口详解

目录 第一章、快速了解文件路径1.1&#xff09;什么是文件路径&#xff1f;1.1.1&#xff09;绝对路径1.1.2&#xff09;相对路径 1.2&#xff09;重要&#xff1a;相对路径的表示方法1.2.1) ./ 与 ../ 1.3&#xff09;文件路径与环境变量1.3.1&#xff09;什么是环境变量1.3.2…...

极狐GitLab 17.7正式发布,可从 GitLab 丝滑迁移至极狐GitLab【二】

GitLab 是一个全球知名的一体化 DevOps 平台&#xff0c;很多人都通过私有化部署 GitLab 来进行源代码托管。极狐GitLab 是 GitLab 在中国的发行版&#xff0c;专门为中国程序员服务。可以一键式部署极狐GitLab。 学习极狐GitLab 的相关资料&#xff1a; 极狐GitLab 官网极狐…...

分布式光纤传感|分布式光纤测温|线型光纤感温火灾探测器DTS|DTS|DAS|BOTDA的行业16年的总结【2024年】

背景&#xff1a; 从2008年&#xff0c;从事分布式光纤传感行业已经过了16年时间了&#xff0c;依稀记得2008年&#xff0c;看的第一遍论文就是中国计量大学张在宣老爷子的分布式光纤测温综述&#xff0c;我的经历算是行业内极少数最丰富的之一。混过学术圈&#xff1a; 发表…...

深度学习在微纳光子学中的应用

深度学习在微纳光子学中的主要应用方向 深度学习与微纳光子学的结合主要集中在以下几个方向&#xff1a; 逆向设计 通过神经网络快速预测微纳结构的光学响应&#xff0c;替代传统耗时的数值模拟方法。例如设计超表面、光子晶体等结构。 特征提取与优化 从复杂的光学数据中自…...

国防科技大学计算机基础课程笔记02信息编码

1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制&#xff0c;因此这个了16进制的数据既可以翻译成为这个机器码&#xff0c;也可以翻译成为这个国标码&#xff0c;所以这个时候很容易会出现这个歧义的情况&#xff1b; 因此&#xff0c;我们的这个国…...

树莓派超全系列教程文档--(61)树莓派摄像头高级使用方法

树莓派摄像头高级使用方法 配置通过调谐文件来调整相机行为 使用多个摄像头安装 libcam 和 rpicam-apps依赖关系开发包 文章来源&#xff1a; http://raspberry.dns8844.cn/documentation 原文网址 配置 大多数用例自动工作&#xff0c;无需更改相机配置。但是&#xff0c;一…...

React hook之useRef

React useRef 详解 useRef 是 React 提供的一个 Hook&#xff0c;用于在函数组件中创建可变的引用对象。它在 React 开发中有多种重要用途&#xff0c;下面我将全面详细地介绍它的特性和用法。 基本概念 1. 创建 ref const refContainer useRef(initialValue);initialValu…...

【人工智能】神经网络的优化器optimizer(二):Adagrad自适应学习率优化器

一.自适应梯度算法Adagrad概述 Adagrad&#xff08;Adaptive Gradient Algorithm&#xff09;是一种自适应学习率的优化算法&#xff0c;由Duchi等人在2011年提出。其核心思想是针对不同参数自动调整学习率&#xff0c;适合处理稀疏数据和不同参数梯度差异较大的场景。Adagrad通…...

Linux简单的操作

ls ls 查看当前目录 ll 查看详细内容 ls -a 查看所有的内容 ls --help 查看方法文档 pwd pwd 查看当前路径 cd cd 转路径 cd .. 转上一级路径 cd 名 转换路径 …...

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个生活电费的缴纳和查询小程序

一、项目初始化与配置 1. 创建项目 ohpm init harmony/utility-payment-app 2. 配置权限 // module.json5 {"requestPermissions": [{"name": "ohos.permission.INTERNET"},{"name": "ohos.permission.GET_NETWORK_INFO"…...

#Uniapp篇:chrome调试unapp适配

chrome调试设备----使用Android模拟机开发调试移动端页面 Chrome://inspect/#devices MuMu模拟器Edge浏览器&#xff1a;Android原生APP嵌入的H5页面元素定位 chrome://inspect/#devices uniapp单位适配 根路径下 postcss.config.js 需要装这些插件 “postcss”: “^8.5.…...

安宝特案例丨Vuzix AR智能眼镜集成专业软件,助力卢森堡医院药房转型,赢得辉瑞创新奖

在Vuzix M400 AR智能眼镜的助力下&#xff0c;卢森堡罗伯特舒曼医院&#xff08;the Robert Schuman Hospitals, HRS&#xff09;凭借在无菌制剂生产流程中引入增强现实技术&#xff08;AR&#xff09;创新项目&#xff0c;荣获了2024年6月7日由卢森堡医院药剂师协会&#xff0…...

Golang——6、指针和结构体

指针和结构体 1、指针1.1、指针地址和指针类型1.2、指针取值1.3、new和make 2、结构体2.1、type关键字的使用2.2、结构体的定义和初始化2.3、结构体方法和接收者2.4、给任意类型添加方法2.5、结构体的匿名字段2.6、嵌套结构体2.7、嵌套匿名结构体2.8、结构体的继承 3、结构体与…...