前端Web开发基础知识

HTML定义

超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。

什么是 HTML?

HTML 是用来描述网页的一种语言。

  • HTML 指的是超文本标记语言: HyperText Markup Language
  • HTML 不是一种编程语言,而是一种标记语言
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页
  • HTML 文档包含了HTML 标签文本内容
  • HTML文档也叫做 web 页面

HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词,比如 <html>
  • HTML 标签通常是成对出现的,比如 <b> 和 </b>
  • 标签对中的第一个标签是开始标签,第二个标签是结束标签
  • 开始和结束标签也被称为开放标签闭合标签

<标签>内容</标签>


HTML 元素

"HTML 标签" 和 "HTML 元素" 通常都是描述同样的意思.

但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签,如下实例:

HTML 元素:

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


Web 浏览器

Web浏览器(如谷歌浏览器,Internet Explorer,Firefox,Safari)是用于读取HTML文件,并将其作为网页显示。

浏览器并不是直接显示的HTML标签,但可以使用标签来决定如何展现HTML页面的内容给用户:

标签的语法

标签 成对 出现,中间包裹内容
<>里面 放英文字母(标签名)
  结束标签比开始标签多 /
双标签 :成对出现的标签
单标签 :只有开始标签,没有结束标签

HTML 基本骨架

html:整个网页

html:整个网页
head:网页头部,用来存放给浏览器看的信息,例如CSS
  body:网页主体,用来存放给用户看的信息,例如图片、文字
VS Code 快速生成骨架:
在 HTML 文件( .html )中, !(英文) 配合 Enter / Tab 键

  • <!DOCTYPE html> 声明为 HTML5 文档
  • <html> 元素是 HTML 页面的根元素
  • <head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8
  • <title> 元素描述了文档的标题
  • <body> 元素包含了可见的页面内容
  • <h1> 元素定义一个大标题
  • <p> 元素定义一个段落

 标签的关系

作用:明确标签的书写位置;让代码格式更整齐
父子关系 (嵌套关系)
兄弟关系 (并列关系)
* 代码格式
父子关系: 子级标签换行且缩进 (Tab键)
兄弟关系: 兄弟标签换行要对齐

注释

        注释就是对代码的解释和说明,其目的是让人们能够更加轻松地了解代码。注释是编写程序时,写程序的人给一个语句、程序段、函数等的解释或提示,能提高程序代码的可读性。
        在编写HTML代码时,我们经常要在一些关键代码旁做一下注释,这样做的好处很多,比如:方便理解、方便查找或方便项目组里的其它程序员了解你的代码,而且可以方便以后你对自己代码进行修改。学习和工作中,关键代码都要加注释
        <!--..-->注释标签用来在源文档中插入注释,注释不会在浏览器中显示。
在VS Code 中,添加/删除注释的快捷键:Ctrl +/

<!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><!-- 这是文字,能看见吗? -->
</body>
</html>

注释是不会显示再网页内容中的 

标题标签

—般用在新闻标题、文章标题、网页区域名称、产品名称等等。

列如:

标题标签

标签名:h1 ~ h6(双标签)

显示特点:

  • 文字加粗
  • 字号逐渐减小
  • 独占一行(换行)
<!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><h2>二级标题</h2><h3>三级标题</h3><h4>四级标题</h4><h5>五级标题</h5><h6>六级标题</h6>
</body>
</html>

h1 标签在一个网页中只能用一次,用来放新闻标题网页的 logo

h2 ~ h6 没有使用次数的限制

段落标签

一般用在新闻段落、文章段落、产品描述信息等等。

例如:

标签的语法:

标签名:p(双标签)

显示特点:

  • 独占一行
  • 段落之间存在间隙
<!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><p>杰西卡·霍兰德(蒂尔达·斯文顿TildaSwinton饰)是旅居哥伦比亚的欧洲人,她来到波哥大看望她生病的姐姐(艾格尼丝·布雷克AgnesBrekke饰)。因为总是听到奇怪的巨响,于是她试图去找寻幻听的根源,并由此开始了一场由幻想、偶遇与重逢组成的,与记忆和历史产生回响的旅程。</p><p>杰西卡·霍兰德(蒂尔达·斯文顿TildaSwinton饰)是旅居哥伦比亚的欧洲人,她来到波哥大看望她生病的姐姐(艾格尼丝·布雷克AgnesBrekke饰)。因为总是听到奇怪的巨响,于是她试图去找寻幻听的根源,并由此开始了一场由幻想、偶遇与重逢组成的,与记忆和历史产生回响的旅程。</p></body>
</html>

换行与水平线标签

 换行:<br>(单标签)

水平线:<hr> (单标签)

<!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>这是第一行内容<br>这是第二行内容<hr>    
</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><strong>strong加粗效果</strong>  <b>b的加粗效果</b><br><em>em的倾斜</em><i>i的倾斜</i><br><ins>ins下划线</ins><u>u下划线</u><br><del>del的删除线</del><s>s的删除线</s>
</body>
</html>

图像标签

作用:在网页中插入图片

语法:

<img src="图片的 URL">

src用于指定图像的位置和名称,是 <img> 的必须属性

例如:

在了解图片标签之前我们必须先了解以下路径

路径指的是查找文件时,从起点到终点经历的路线。

路径分类:

  • 相对路径:从当前文件位置出发查找目标文件
  • 绝对路径:从盘符出发查找目标文件

相对路径 -当前文件位置出发查找目标文件

⚫ / 表示进入某个文件夹里面

⚫ . 表示当前文件所在文件夹 

⚫ .. 表示当前文件的上一级文件夹 

绝对路径 -盘符出发查找目标文件

 图像标签-属性

属性名="属性值"

属性写在尖括号里面,标签名后面,标签名和属性之间用空格隔开,不区分先后顺序

 

<!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><img src="D:\图片\图片\背景.jpg" width="500">  <!--绝对路径,通过电脑的盘符可以找到--><img src="./相对路径/images/image.png" width="500"> <!--相对路径-->>
</body>
</html>

 超链接标签

作用:点击跳转到其他页面。

语法:

href 属性值是跳转地址,是超链接的必须属性。 超链接默认是在当前窗口跳转页面,添加 target="_blank" 实现新窗口打开页面。 拓展:开发初期,不确定跳转地址,则 href 属性值写为 #,表示空链接,页面不会跳转,在当前页面刷新一次。

<!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--><a href="https://www.baidu.com/index.htm">点击跳转百度</a><br><!--跳转到本地--><!--target="_blank"新窗口跳转页面,原窗口不会消失--><a href="./09-图像标签.html" target="_blank">点击跳转到图片</a><!--开发初期,不知道超链接的跳转地址,href属性值写#,表示空连接,不会跳转--><a href="#">空链接</a></body>
</html>

 

音频标签

语法

常见属性 

拓展:书写 HTML5 属性时,如果属性名和属性值相同,可以简写为一个单词。 

 

视频标签


语法

常见属性

 

【综合案例一 ---- 个人简介】

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>个人简介</title>
</head>
<body><h1>雷军</h1><hr><p>雷军,1969年12月16日出生于湖北省仙桃市剅河镇赵湾村四组,<a href="https://baike.baidu.com/item/%E5%B0%8F%E7%B1%B3%E7%A7%91%E6%8A%80%EF%BC%88%E6%AD%A6%E6%B1%89%EF%BC%89%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8/22131387?fr=ge_ala " target="_blank">小米科技有限责任公司</a> 创始人、董事长、首席执行官(CEO) ,中华人民共和国第十二、十三、十四届全国人民代表大会代表,中国民间商会副会长。</p><img src="https://bkimg.cdn.bcebos.com/pic/8718367adab44aed2e73194fd7449001a18b87d64d5d?x-bce-process=image/format,f_auto/quality,Q_70/resize,m_lfit,limit_1,w_536" width="200" ><h2>学习经历</h2><p>雷军于1991年毕业于<strong>武汉大学</strong> ,后被分配到北京航天部某研究所工作。1992年1月,加盟金山软件公司,8月,任金山公司北京开发部经理。1994年,任北京金山软件公司总经理 。1996年11月,带领团队开发WPS 97,为金山制定新战术,先后推出了金山影霸、金山词霸、游戏《剑侠情缘》等产品,解决了生存危机 。1998年,出任金山首席执行官(CEO)。2000年底,任北京金山软件股份有限公司总裁 [11]。2007年12月,卸任金山软件首席执行官 ,投身天使投资行业。2010年4月6日,创立<a href="https://ir.mi.com/zh-hans/corporate-information/company-profile?eqid=82c78aa2001499320000000264662346&mobile=1 " target="_blank">小米公司</a>  。2011年7月,时隔三年半后重回金山,出任金山软件有限公司董事长 。2015年4月起,任金山云控股有限公司董事长。2016年5月17日,接手小米手机部,负责手机业务并大规模调整组织架构 。2019年5月17日,兼任中国区总裁,全面负责中国区业务开展和团队管理。2021年3月30日,任小米智能电动汽车业务首席执行官。</p><h3>主要成就</h3><p>雷军于2013年12月获评为中国经济年度人物。2014年2月,入选中国互联网年度人物。<ins>2018年,入选改革开放40年百名杰出民营企业家。2020年,当选北京市劳动模范。2021年,入选《福布斯》中国最佳CEO(第一名)。2022年,入选《财富》中国最具影响力的50位商界领袖。</ins></p>
</body>
</html>

列表标签

HTML 列表


HTML 支持有序、无序和定义列表:

HTML 列表

有序列表

  1. 第一个列表项
  2. 第二个列表项
  3. 第三个列表项

无序列表

  • 列表项
  • 列表项
  • 列表项

无序列表

作用:布局排列整齐的不需要规定顺序的区域。

标签:ul嵌套li, u是无序列表,li是列表条目。

标签里面只能包裹li标签

li标签里面可以包裹任何内容


 有序列表

作用:布局排列整齐的需要规定顺序的区域。

标签:ol嵌套li,ol是有序列表,li是列表条目。

ol标签里面只能包裹li标签

li标签里面可以包裹任何内容


定义列表

 标签:dl嵌套dt和dd,dl是定义列表,dt是定义列表的标题,dd是定义列表的描述/详情。

例如:

dl里面只能包含dt和dd
dt和dd里面可必包含任何内容

表格标签

 标签:table嵌套 tr,tr嵌套 td / th

提示:在网页中,表格默认没有边框线,使用border属性可以为表格添加边框线。

 表格结构标签

作用:用表格结构标签把内容划分区域,让表格结构更清晰,语义更清晰

合并单元格

 作用:将多个单元格合并成一个单元格,以合并同类信息

合并单元格的步骤:
1.明确合并的目标

2.保留最左最上的单元格,添加属性(取值是数字,表示需要合并的单元格数量)

 --跨行合并,保留最上单元格,添加属性是rowspan

--跨列合并,保留最左单元格,添加属性colspan

3.删除其他单元格

 表单标签

作用:收集用户信息。

使用场景:
        登录页面

        注册页面

        搜索区域

例如:

input标签

input标签type属性值不同,则功能不同。

语法:<input type="....">

 

 input占位文本

占位文本:提示信息

<input type = "..." placeholder="提示信息">

文本框和密码框都可以使用

 

radio单选框

 常见属性

 

file上传文件 

        默认情况下,文件上传表单控件只能上传一个文件,添加 multiple属性可以实现文件多选功能。

checkbox多选框

多选框也叫复选框

默认选中:checked.

 

下拉菜单

 标签: select嵌套option,select是下拉菜单整体,option是下拉菜单的每一项。

文本域标签

作用:多行输入文本的表单控件

例如:发QQ空间,发微博等

标签:textarea,双标签

label标签

作用:网页中,某个标签的说明文本。

用label标签绑定文字和表单的空间关系,增大表单控件的点击范围。

写法一:
        label标签只包裹内容,不包裹表单控件
        设置label标签的for属性值和表单控件的id属性值相同

写法二:

        使用label标签包裹文字和表单控件,不需要属性

提示:支持label标签增大点击范围的表单控件:文本框、密码框、上传文件、单选框、多选框、下拉菜单、文本域等等。

按钮标签

语法

type属性值

网页布局标签

作用:布局网页(划分网页区域,摆放内容)

标签:

        div:独占一行

        span:不换行

字符实体

作用:在网页中显示预留字符。



综合案例一

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>体育新闻</title>
</head>
<body><ul><li><img src="https://p3.img.cctvpic.com/photoAlbum/page/performance/img/2024/5/1/1714530694127_16.jpg" alt="" height="250"><h3>长春亚泰坐镇主场迎战升班马深圳新鹏城,新帅能否带领长春亚泰走出困境?</h3></li><li><img src="https://p2.img.cctvpic.com/photoAlbum/page/performance/img/2024/5/1/1714537137855_270.jpg" alt=""height="250"><h3>雄鹿队在东部首轮第五战主场以115-92战胜印第安纳步行者队。雄鹿队将总比分追至2-3</h3></li><li><img src="https://p1.img.cctvpic.com/photoAlbum/page/performance/img/2024/5/1/1714525113733_774.jpg" alt="" height="250"><h3>纳达尔不敌莱赫奇卡无缘八强,这也是纳达尔生涯在马德里大师赛的最后一场比赛。</h3></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>注册信息</title>
</head>
<body><h1>注册信息</h1><form action=""><h2>个人信息</h2>姓名:<input type="text" placeholder="请输入真实姓名"> <br><br>密码:<input type="password" placeholder="请输入密码"> <br><br>确认密码:<input type="password" placeholder="请输入确认密码"><br><br>性别:<label><input type="radio" name="gender"> 男 </label><label><input type="radio" name="gender"> 女 </label><br><br>居住城市:<select name="" id=""><option value="">上海</option><option value="" selected>北京</option><option value="">广州</option><option value="">武汉</option></select><h2>教育经历</h2>最高学历:<select name="" id=""><option value="">小学</option><option value="">初中</option><option value="">高中</option><option value="">大学</option><option value="">硕士</option><option value="" selected>博士</option></select><br><br>学校名称:<input type="text"> <br><br>所学专业:<input type="text"> <br><br>在校时间:<select name="" id=""><option value="" selected>2015</option><option value="">2016</option><option value="">2017</option><option value="">2018</option><option value="">2019</option></select>--<select name="" id=""><option value="">2018</option><option value="" selected>2019</option><option value="">2020</option><option value="">2021</option><option value="">2022</option></select><h2>工作经历</h2>公司名称:<input type="text"><br><br>工作描述:<br><textarea ></textarea><br><br><input type="checkbox">已阅读同意以下协议:<ul><li><a href="https://www.xiaoyezi.com/html/panda_agreement.html" target="_blank">《用户服务协议》</a></li><li><a href="https://lz.cqrd.gov.cn/lzptyszc.html" target="_blank">《隐私政策》</a></li></ul><br><br><button>免费注册</button><button type="restet"> 重新填写</button></form></body>
</html>

 

 CSS

css定义

        层叠样式表(Cascading Style Sheets,缩写为CSS),是一种样式表语言,用来描述HTML文档的呈现(美化内容)。书写位置: title标签下方添加style双标签,style标签里面书写CSS代码。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>初始CSS</title><style>/*CSS代码*//*选择器{CSS属性}*//*属性名和属性值成对出现->键值对*/p {/*文字颜色*/color: rgb(231, 13, 13);/*字号*/font-size: large;}</style>
</head>
<body><p>体验CSS</p>
</body>
</html>

CSS引入方式

1.内部样式表:

        CSS代码写在style标签里面

2.外部样式标表:

        CSS代码写在单独的CSS文件中(.css)

        在HTML中使用link标签引入

3.行内样式:

        配合JavaScript使用

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><!--link引入外部样式表--><link rel="stylesheet" href="./my.css">
</head>
<body><p>这是P标签</p><!--行内,style=“CSS属性”--><div style="color:brown; font-size: 30px;">这是div标签</div>
</body>
</html>
/*CSS代码文件*/
p {color: gold;}

选择器

作用:查找标签,设置样式

基础选择器

        1.标签选择器

        2.类选择器

        3.id选择器

        4.通配符选择器

标签选择器

标签选择器:使用标签名作为选择器→选中同名标签设置相同的样式。
例如:p,h1,div,a,img.....

类选择器

作用:查找标签,差异化设置标签的显示效果。
步骤:

        定义类选择器->.类名

        使用类选择器->标签名class="类名"

        类名自定义,不要用纯数字或中文,尽量用英文命名

        一个类选择器可以供多个标签使用

        一个标签可以使用多个类名,类名之间用空格隔开

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>/*定义*/.red {color: red;}.size {font-size: 30px;}</style>
</head>
<body><!--使用---><!--一个类选择器可以给多个标签使用--><p class="red">1111</p><p>2222</p><!--一个标签可以使用多个类名,类名用空格隔开--><div class="red size">div标签</div>
</body>
</html>

id选择器

作用:查找标签,差异化设置标签的显示效果。
场景:id选择器一般配合JavaScript使用,很少用来设置CSS样式

步骤:
        定义id选择器→#id名
        使用id选择器→标签添加id= "id名"

同一个id选择器在一个页面只能使用一次。

通配符选择器

作用:查找页面所有标签,设置相同样式。
通配符选择器 : *,不需要调用,浏览器自动查找页面所有标签,设置相同的样式

画盒子

目标:使用合适的选择器画盒子

属性

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>画盒子</title><style>.red {/*宽度*/width: 100px;/*高度*/height: 100px;/*背景色*/background-color: brown;}.orange{width: 200px;height: 200px;background-color: orange;}</style>
</head>
<body><div class="red">div1</div><div class="orange">div2</div>
</body>
</html>

文字控制属性

字体大小

■ 属性名:font-size

■ 属性值:文字尺寸,PC端网页最常用的单位px

字体粗细

■ 属性名:font-weight

■ 属性值:

        ▶数字

        

        ▶关键字

        

  字体倾斜

■作用:清楚文字默认的倾斜效果

■ 属性名:font-style

■ 属性值:

        正常:normal

        倾斜:italic

行高

■作用:设置多行文本的间距

■属性名:line-height

■属性值:

        数字+px

        数字(当前标签font-size属性值的倍数)

行高的组成

行高的测量方法:从一行文字的最顶端(最底端)量到下一行文字的最顶端(最底端)
 

行高---垂直居中

垂直居中技巧:行高属性值等于盒子高度属性值

 字体族

属性名:font-family

属性值:字体名

font-family属性值可以书写多个字体名,各个字体名用逗号隔开,执行顺序是从左向右依次查找
 

Font复合属性

复合属性:属性的简写方式,一个属性对应多个值的写法,各个属性值之间用空格隔开。

font: 是否倾斜   是否加粗    字号/行高    字体(必须按顺序书写)

注意:字号和字体值必须书写,否则font属性不生效。

文本缩进

属性名:text-indent

属性值:

        数字+px

        数字+em(推荐:1em=当前的字号大小)

文本对齐

作用:控制内容水平对齐

属性名:text-align

属性值

        

水平对齐方式-图片

text-align本质是控制内容的对齐方式,属性要设置给内容的父级。

我们可以将图片放入div标签中,在将div中的文字内容居中即可。

修饰线

属性名:text-decoration

属性值:

        

文字颜色

属性名:color

属性值:

综合案例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.center{text-align: center;font-weight: 400;font-size: 30px;color: #333;}div{font-size: 14px;color: #999999;}p{text-indent: 2em;font-size: 18px;color:#333;}.imgcenter{text-align: center;}</style>
</head>
<body><h1 class="center">哥伦比亚要与以色列断交:巴勒斯坦亡了,人类就亡了</h1><div>来源:2024年05月02日 07:56 新浪网 作者 观察者网</div><p> <strong>(观察者网讯)</strong> 据法新社和英国广播公司(BBC)报道,当地时间5月1日,哥伦比亚总统佩特罗在哥伦比亚首都波哥大参加群众集会,庆祝国际劳动节。在讲话中,佩特罗宣布,由于以色列在加沙地带进行“种族灭绝”,哥伦比亚“将于明天”(即当地时间2日)起与以色列断绝所有外交关系。</p><p>“明天,我们将与以色列断绝外交关系……”佩特罗表示,“因为以色列有一位种族灭绝的总统。我们不能眼睁睁地看着种族灭绝、整个民族被消灭的事情发生,却对此无动于衷。”</p><p>佩特罗称:“如果巴勒斯坦灭亡,人类也会灭亡。”话毕,在场群众一片欢呼。</p><div class="imgcenter"><img src="https://k.sinaimg.cn/n/sinakd20240502s/261/w591h470/20240502/57d5-aaa9eef5611c0c5a95de30a755431c7a.jpg/w700d1q75cms.jpg?by=cms_fixed_width" alt=""></div><p>对此,以色列方面给予强烈回应。当日晚些时候,以色列外长卡茨在社交媒体X平台发文写道:“历史会记住,佩特罗选择站在人类所知的最可恶的怪物一边……而以色列和哥伦比亚一直保持着友好的关系。即使是一个反犹和充满仇恨的总统也不会改变这一点。”</p>
</body>
</html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/6198.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

汇编语言——比较两个字符串STRING1和STRING2所含字符是否完全相同,若相同则显示MATCH, 不相同则显示NO MATCH

CMPS 串比较指令&#xff1a; CMPS SRC, DST CMPSB &#xff08;字节&#xff09; CMPSW &#xff08;字&#xff09; 执行操作&#xff1a; ((SI)) - ((DI)) 根据比较结果置条件标志位&#xff1a;相等 ZF1&#xff1b;不等 ZF0 字节操作&#xff1a;(SI)←(SI)1, (DI)←(DI…

window 安装ai 基础环境(yolo8,训练推理等)

步骤: 1. python sdk 3.9以上 2. 显卡驱动 可以使用驱动精灵 直接安装N 卡推荐 3. 安装机器学习套件CUDA cuda 安装在PyTorch 需要根 PyTorch版本一致&#xff0c;我的 win-srv 最高支持 12.1 下载地址&#xff1a; https://developer.nvidia.com/cuda-toolkit-archive…

数据结构——循环结构:for循环

今天是星期五&#xff0c;明天休息&#xff0c;后天补课&#xff0c;然后就是运动会&#xff0c;接着是放假。&#xff08;但这些都和我没关系啊&#xff0c;哭死&#xff01;&#xff09;今天脑袋难得清醒一会儿&#xff0c;主要是醒的比较早吧&#xff0c;早起学了一会&#…

汇编语言——输入两个字数据(16位的数)X,Y,计算Z=X+Y,并把Z的结果显示出来

文章目录 以2进制输入&#xff0c;2进制输出&#xff08;无符号&#xff09;以2进制输入&#xff0c;2进制输出&#xff08;带符号&#xff09;以8进制输入&#xff0c;8进制输出以10进制输入&#xff0c;10进制输出以16进制输入&#xff0c;16进制输出 仅供参考 X、Y的输入可…

Windows系统启动Redis

一、下载windows版本Redis 1.1 选择一个使用的版本 在以下地址中选择一个Windows系统可以使用的版本 https://github.com/microsoftarchive/redis/tags 1.2 下载 1.3 解压到文件夹 二、启动Redis 双击redis-server.exe启动Redis 出现以下界面即启动成功 三、测试是否可以使…

Linux第二节--常见的指令介绍集合(持续更新中)

点赞关注不迷路&#xff01;&#xff0c;本节涉及初识Linux第二节&#xff0c;主要为常见的几条指令介绍。 Linux下基本指令 1. ls 指令 语法&#xff1a; ls [选项][目录或文件] 功能&#xff1a;对于目录&#xff0c;该命令列出该目录下的所有子目录与文件。对于文件&#…

某米社区请求data类型multipart_form-data分析

随笔记录 之前未曾遇到请求的Content-Type:multipart/form-data; boundary=----WebKitFormBoundary9Fxpi3Dvlnhm3MKq,今天就简单是根据目标网站进行分析下,目标站点是:aHR0cHM6Ly93ZWIudmlwLm1pdWkuY29tL3BhZ2UvaW5mby9taW8vbWlvL3BjU2VhcmNoP2Zyb21QYXRobmFtZT1taW9Cb2FyZ…

边缘计算含义与应用简析

边缘计算概述 边缘计算使数据存储和处理靠近生成或收集数据的位置&#xff0c;而不是在位于数千公里的服务器上。它将通过保持灵活性在边缘无缝可靠地部署服务。它比云计算更安全&#xff0c;因为不需要传输数据。因此&#xff0c;在将数据从边缘移动到云端时&#xff0c;不用…

eSIM Network搭建指南

有任何关于GSMA\IOT\eSIM\RSP\业务应用场景相关的问题&#xff0c;欢迎W: xiangcunge59 一起讨论, 共同进步 (加的时候请注明: 来自CSDN-iot).

用自动化工具轻松吸引更多粉丝关注

在当今这个信息爆炸的时代&#xff0c;如何让自己的品牌、产品或者个人在众多信息中脱颖而出&#xff0c;吸引更多的粉丝关注&#xff0c;成为了许多人面临的问题。而自动化工具&#xff0c;就是我们解决这个问题的利器。 首先&#xff0c;我们要明白&#xff0c;吸引粉丝关注…

【笔记】Simulink与Workbench交互+自定义m函数封装为Simulink模块

以如下三角函数为例&#xff0c;说明建模方法 ya*sin(b*2*pi*uc);0.总模型总代码 总模型 总代码&#xff1a; clc clear close allt_all10; a10; b1; c0;%pi/2; delta_t0.01; simOutsim(test240430); out_tsimOut.tout; out_y1simOut.yout{1}.Values; out_y2simOut.yout{2}.…

【C 数据结构】深度优先搜索、广度优先搜索

文章目录 【 1. DFS 深度优先搜索 】1.1 基本原理1.2 C 实现 【 2. BFS 广度优先搜索 】2.1 基本原理2.2 C 实现 【 3. 深度优先生成树、广度优先生成树 】【 4. 深度优先生成森林、广度优先生成森林 】4.1 深度优先生成森林4.2 广度优先生成森林 对存储的图中的顶点进行遍历搜…

告诉我们事实:用知识图谱增强大语言模型以实现事实感知的语言建模

&#x1f349; CSDN 叶庭云&#xff1a;https://yetingyun.blog.csdn.net/ 论文标题&#xff1a;Give Us the Facts: Enhancing Large Language Models with Knowledge Graphs for Fact-aware Language Modeling 论文链接&#xff1a;https://arxiv.org/abs/2306.11489 论文作…

O2OA开发平台前端源码级二次开发(Vue3,React)

在使用O2OA进行项目定制化开发时&#xff0c;我们可以开发新的前端组件&#xff08;x_component&#xff09;以扩展O2OA来实现更多的业务。这种新增前端组件或者前端业务的开发通常会配合后端自定义应用实现的服务来完成系统内数据的交互。在当系统默认的界面不符合系统UI/UE设…

leetcode84柱状图中最大的矩形

题解&#xff1a; - 力扣&#xff08;LeetCode&#xff09; class Solution {public int largestRectangleArea(int[] heights) {Stack<Integer> stack new Stack<>();int maxArea Integer.MIN_VALUE;for(int i 0;i < heights.length;i){int curHeight hei…

spring boot 启动流程详解

主启动类 SpringBootApplication MapperScan("com.example.mapper") public class StableBootApplication {public static void main(String[] args) {SpringApplication.run(StableBootApplication.class,args);} }SpringApplication类中有个静态run()方法&#xf…

成都旅游攻略

第一天 大熊猫基地(55一人) 切记要去早&#xff0c;否则只能看到熊猫屁股 文殊院(拜文殊菩萨) 杜甫草堂(50一人) 宽窄巷子(旅游打卡拍照) 奎星楼街吃晚饭 这里的饭菜很可口 第二天 东郊记忆(成都故事.川剧变脸)主要是拍照打卡 春熙路 IFS国金中心(打卡熊猫屁屁) 太…

VBA技术资料MF149:在多个工作表某单元格中插入图片

我给VBA的定义&#xff1a;VBA是个人小型自动化处理的有效工具。利用好了&#xff0c;可以大大提高自己的工作效率&#xff0c;而且可以提高数据的准确度。“VBA语言専攻”提供的教程一共九套&#xff0c;分为初级、中级、高级三大部分&#xff0c;教程是对VBA的系统讲解&#…

2024-5-1我把QQ群聊天记录分析工具重写了一下

【下载地址】 https://www.lanzoub.com/b00rn0g47e 密码:9hww 【项目背景】 2020年我用Tkinter写过一个QQ群聊天记录分析的工具exe&#xff0c;后续也写过一个纯JS前端的版本&#xff0c;前阵子有个用户反馈不能用了&#xff0c;顺便看能不能加入一个分析关键词的功能&…

《引爆流量 获客技术》实战方法,让你的生意客户裂变渠道裂变(13节)

[1]-先导课_.mp4 [2]-第1节:设计客户终身价值的方法和买客户思维 .mp4 [3]-第2节:【渠道模型】解决谁是我的客户如何找到 ,mp4 [4]-第3节:【诱饵模型】解决 如何获得更多的客户 ,mp4 [5]-第4节:【钩子模型】解决让目标客户主动找你的 .mp4 [6]-第5节:【裂变策略】解决让来…