【前端】从零开始学习编写HTML

目录

一、什么是前端

二、什么是HTML

三、HTML文件的基本结构

四、HTML常见标签

4.1 注释标签

4.2 标题标签

4.3 段落标签

4.4 换行标签

4.5 格式化标签

4.6 图片标签

4.7 超链接标签

4.8 表格标签

4.9 列表标签

4.10 表单标签

（1）form标签

（2）input标签

（3）label标签

（4）select标签

（5）textarea标签

4.11 无语义标签

五、实现简单的简历展示网页

六、实现简单的简历填写页面

一、什么是前端

前端开发是创建Web页面或APP等前端界面呈现给用户的过程，负责把界面更好的呈现给用户

相对于后端主要负责用户看不见的数据处理，前端是指用户可以看到和操作的部分，例如网页页面，PC端程序页面或移动端APP页面。

 

二、什么是HTML

HTML（HyperText Markup Language）是超文本标记语言的简称，是一种用于创建网页的标准标记语言。

  • 超文本：一种文本类型，允许通过链接（通常称为超链接）从一个文档跳转到另一个文档或文档中的特定部分

 

三、HTML文档的基本结构

<html><head><title>页面标题</title></head><body>页面内容</body>
</html>

如上：

  • html标签是整个HTML文档的根标签，用来标记HTML文档的开始和结束
  • head标签用于标记HTML文档头部的开始和结束，其中填写页面的属性，例如head的子标签titie代表页面的标题
  • body标签用于标记HTML文档主体的开始和结束，其中填写页面当中显示的内容

427e2666e3844363a702b4e78c16d316.png

其中被尖括号包括的就是HTML标签，不同标签之间分为父子关系和兄弟关系

我们可以通过上面不同标签的缩进程度来观察它们的关系，例如head和body是html的子标签，title是head的子标签，head和body之间是兄弟关系

不同标签之间的结构关系就构成了一棵DOM树

 

四、HTML常见标签

HTML标签又分为单标签和双标签

单标签只会单独出现，用法：<标签名/>

双标签成对出现，用法：<标签名></标签名>

4.1 注释标签

<!-- 我是注释 -->

像这样，用尖括号、感叹号和横杠组成注释标签，其中填写自己需要的注释

注释不会显示在网页界面上，主要用于提高代码的可读性

 

4.2 标题标签

就像CSDN的富文本编辑器中提供了六级标题，HTML的标题标签也有六个，从h1到h6逐级变小

例如：

<html><head><title>页面标题</title></head><body><h1>这是一级标题</h1><h2>这是二级标题</h2><h3>这是三级标题</h3><h4>这是四级标题</h4><h5>这是五级标题</h5><h6>这是六级标题</h6></body>
</html>

e5d29a1aaef64f5181751208a244e6b9.png

 

4.3 段落标签

我们在开发工具中编写HTML文档，将一长段文字分成多段，但是在网页中并不会显示分成多段的效果，仍然是一长段，例如：

581d68fb999e4ce8aa208e1393adf466.png

在浏览器中运行：

c4c855c8c02149099021cc0d462d2eca.png

在HTML中直接输入回车并不能真正的实现分段，而是相当于一个空格

如果我们要进行分段，需要用到段落标签p，具体用法如下：

<html><head><title>页面标题</title></head><body><p>1111111111111111111</p><p>2222222222222222222</p></body>
</html>

再次运行：

2716221aa90748c7b8ae09ed5dc0022e.png

会发现成功分成了两段，段落之间有一定的间隙

段落标签p是一个双标签，在开始标签和结束标签之间填写自己想要的内容

当然，标签不限制只能在同一行，像这样也是正确的用法：

<html><head><title>页面标题</title></head><body><p>1111111111111111111</p><p>2222222222222222222</p></body>
</html>

 

4.4 换行标签

换行标签br是break的缩写，是一个单标签，规范写法是<br/>，不建议写成<br>

区别于段落标签p，用br标签只会进行分行，不会产生空隙

例如：

<html><head><title>页面标题</title></head><body>hello<br/>world</body>
</html>

在浏览器中运行：

0ce61c06133e4d6f98c975c21fb735bc.png

 

4.5 格式化标签

HTML中还有一些标签可以改变字体格式：

  • 加粗：strong标签和 b 标签
  • 倾斜：em标签和 i 标签
  • 删除线：del标签和 s 标签
  • 下划线：ins标签和 u 标签

例如：

<html><head><title>页面标题</title></head><body><strong>加粗</strong><b>加粗</b><em>倾斜</em><i>倾斜</i><del>删除线</del><s>删除线</s><ins>下划线</ins><u>下划线</u></body>
</html>

在浏览器中运行：

1f221ba16dc14601993a6c1d5af05d9a.png

 

4.6 图片标签

要在网页中显示图片，就需要用到图片标签img

img标签中必须带有src属性，用于说明图片的路径，用法：<img src="图片路径">

例如：

<html><head><title>页面标题</title></head><body><img src="html.png"></body>
</html>

在浏览器中运行：

8b0a940241d24b8393591c1ec1f762ef.png

除了保存在本地的图片，网络路径也可以使用，例如：

<html><head><title>页面标题</title></head><body><img src="https://tgi12.jia.com/114/936/14936926.jpg"></body>
</html>

在浏览器中运行：

0d2d603ece0d4e95b0eccc43e13fb39b.png

除了src属性，img标签还有其他属性：

  • alt：替换文本，当图片不能正确显示时会显示一个替换的文字
  • title：提示文本，当鼠标放到图片上会有文字提示
  • width/height：控制宽度和高度，修改一个后另一个会等比例缩放
  • border：控制图片边框

例如：

<html><head><title>页面标题</title></head><body><img src="html.png" alt="HTML" title="这是HTML图标" width="1000px" border="2px"></body>
</html>

属性之间不分先后顺序，按照键值对的格式表示

 

4.7 超链接标签

要实现在网页中跳转到其他地方，就需要超链接标签a

超链接标签也有必须具备的属性href，用来说明点击后要跳转到哪个页面

例如：

<html><head><title>页面标题</title></head><body><a href="https://www.baidu.com/">百度</a></body>
</html>

在浏览器中运行：

bd8011477d254769a39d1279e94fb083.png

点击蓝紫色带下划线的“百度”，就可以跳转到对应的页面

属性href的值有多种形式：

  • 外部链接：其他网站的地址，例如上面的情况
  • 内部链接：网页内部页面之间的链接，使用相对路径即可
  • 空链接：用"#"在herf中占位

例如：

<a href="#">空链接</a>
  • 下载链接：href的值对应的路径是一个文件

例如：

<a href="test.zip">下载文件</a>
  • 网页元素链接：可以给图片等任何元素添加链接

例如：

<a href="https://www.baidu.com/"><img src="baidu.png">
</a>

cd682c65e89d46e1a6bc975483e4c9f8.png

点击该图片就会跳转到百度首页

  • 锚点链接：可以快速定位到页面中的某个位置

例如：

<a href="#one">第一章</a>
<a href="#two">第二章</a>
<p id="one">第一章内容
</p>
<p id="two">第二章内容
</p>

 

4.8 表格标签

要在网页中显示一个表格，就需要使用表格标签table

table有一些子标签：

  • tr：表示表格的一行
  • td：表示一个单元格
  • th：表示表头的单元格，会居中加粗
  • thead：表格的头部区域（范围比th大）
  • tbody：表格的主题区域

其中td和th又是tr的子标签

我们举一个例子：

<html><head><title>页面标题</title></head><body><table><tr><th>姓名</th><th>性别</th><th>年龄</th></tr><tr><td>张三</td><td>男</td><td>18</td></tr><tr><td>李四</td><td>男</td><td>19</td></tr></table></body>
</html>

在浏览器中运行：

a9d4abe8de6f465387de9aa2d8b289ea.png

我们发现这个表格怎么没有边框？事实上，表格标签table包含一些属性，其中边框也是属性之一，需要进行设置

table的属性有：

  • align：表格在页面中的对齐方式，例如align="center"就是在页面中居中对齐
  • border：表示边框，1表示有边框，数字越大边框越粗，""表示无边框
  • cellpadding：表格内容距离边框的距离，默认为1像素
  • cellspacing：单元格之间的距离，默认为2像素
  • width/height：表格尺寸

实际设置中我们可能会发现表格的边框有两条线，这是因为单元格之间有距离，如果将cellspacing设置为0边框就变为了单线。大家可以自己设置一下看看

我们还可以对单元格标签td设置合并单元格：

  • 跨行合并：rowspan="需要合并的单元格数"，将下方的单元格合并
  • 跨列合并：colspan="需要合并的单元格数"，将右方的单元格合并

例如：

<html><head><title>页面标题</title></head><body><table align="center" border="1" cellpadding="5" cellspacing="0" width="500px" height="500px"><tr><th>姓名</th><th>性别</th><th>年龄</th></tr><tr><td>张三</td><td rowspan="2">男</td><td>18</td></tr><tr><td>李四</td><td>19</td></tr></table></body>
</html>

在浏览器中运行：

26c4df009cd3426b974bff4546735d54.png

 

4.9 列表标签

列表标签又分为有序列表、无序列表和自定义列表：

  • 无序列表：ul和li
  • 有序列表：ol和li
  • 自定义列表：dl（总标签）dt（小标题）和dd

例如：

<html><head><title>页面标题</title></head><body><h3>无序列表</h3><ul><li>第一列</li><li>第二列</li><li>第三列</li></ul><h3>有序列表</h3><ol><li>第一列</li><li>第二列</li><li>第三列</li></ol><h3>自定义列表</h3><dl><dt>小标题</dt><dd>第一列</dd><dd>第二列</dd><dd>第三列</dd></dl></body>
</html>

在浏览器中运行：

6ee79482a5f44daeb477e98fa2e8a1bd.png

无序列表中，每一列前面的实心圆可以改成方块或空心圆。可以通过ul标签的type属性修改，默认值为disc（实心圆），还有square（实心方块）和circle（空心圆），例如：

<html><head><title>页面标题</title></head><body><h3>无序列表</h3><ul type="circle"><li>第一列</li><li>第二列</li><li>第三列</li></body>
</html>

fdd763613b374ac7a7aa80703965c030.png

有序列表中每一列前面的数字也可以改成英文字母或罗马数字，也是通过修改ol标签的type属性。

有序序列还可以通过修改ol标签的start属性来改变列表起始的数字

例如：

<html><head><title>页面标题</title></head><body> <h3>有序列表</h3><ol type="I" start="2"><li>第一列</li><li>第二列</li><li>第三列</li></ol></body>
</html>

bc31603049b34105a0b7ba8aaa82b0c2.png

 

4.10 表单标签

要想让用户通过页面输入信息，就需要用到表单标签

（1）form标签

用于创建表单，将用户输入的数据提交到服务器

其中action属性负责定义表单数据提交的目标URL，method属性定义提交数据的HTTP方法

例如：

d842b10bc5964fc78e6ed835b7d0e452.png

这里就涉及到一定的服务器和网络编程相关知识了

 

（2）input标签

用于创建各种输入控件，如文本框、按钮、单选框和复选框

input的type属性用于定义输入控件的类型，是必须要显式定义的属性

输入控件有：

  • 文本框（type="text")：用于输入单行文本 

例如：

<html><head><title>页面标题</title></head><body> <form>输入姓名<input type="text"></form></body>
</html>

59af1b2d24a341278333f8df5c124892.png

  • 密码框（type="password")：用于输入密码

例如：

<html><head><title>页面标题</title></head><body> <form>输入密码<input type="password"></form></body>
</html>

84abf0d511c1412f8bb3c68ee9486955.png

  • 单选框（type="radio")：单选

例如：

<html><head><title>页面标题</title></head><body> <form>性别<input type="radio" name="sex">男<input type="radio" name="sex">女</form></body>
</html>

8d6881979f4c4c0a891d9acee8658a39.png

注意！两个构成单选关系的单选框，name属性的值必须相同才可以实现多选一的效果

如果我们想让某个选项作为默认选择项，可以设置其checked属性，例如：

d63f656d48d3406496727715c1266c1f.png

再次运行，此时男选项就被默认选择了

  • 复选框（type="checkbox")：多选

例如：

<html><head><title>页面标题</title></head><body> <form><input type="checkbox">选项1<input type="checkbox">选项2<input type="checkbox">选项3</form></body>
</html>

0a600977db3e45758d02458fae179ff9.png

  • 普通按钮（type="button")

例如：

<html><head><title>页面标题</title></head><body> <form><input type="button" value="点击"></form></body>
</html>

caf3a72e987c453a8bfed2cf07d1db87.png

当前我们写出的按钮点击后没有响应，需要搭配JS使用，例如：

<html><head><title>页面标题</title></head><body> <form><input type="button" value="点击" onclick="alert('hello')"></form></body>
</html>

26684bdcbacd4a8792e01315b1756a34.png

  • 提交按钮（type="submit")：放在form标签中，点击后就会将数据发送给服务器

例如：

<html><head><title>页面标题</title></head><body> <form>输入姓名<input type="text" name="username"><input type="submit" value="提交"></form></body>
</html>

页面如下：

7aac98d5863f4d189056f1c22c4b59bc.png

在文本框中输入zhangsan后点击提交：

a754a1b7713f402bba352c2d14303e47.png

此时输入的数据就作为参数提交给服务器了

  • 清空按钮（type="reset")：放在form标签中，点击后将所有的用户输入清空

例如：

<html><head><title>页面标题</title></head><body> <form action="1.html">输入姓名<input type="text" name="username"><input type="reset" value="清空"></form></body>
</html>

7ae2d633d90b4ccdb8c01b4e2d83330e.png

在文本框中进行输入后点击清空按钮，即可清空输入的内容

  • 选择文件（type="file")：点击按钮会弹出选择文件界面

例如：

<html><head><title>页面标题</title></head><body> <form><input type="file"></form></body>
</html>

e5f9ba68a99847b88c5d805880b1d167.png

 

（3）label标签

搭配input标签使用，可以与表单控件相关联，当用户点击label标签的内容时，会自动将焦点跳到相关联的表单控件上，能够提高用户体验

例如我们想实现点击选框对应的文字就能选择该选项的功能：

<html><head><title>页面标题</title></head><body> <form><input type="radio" name="sex" id="male"><label for="male">男</label><input type="radio" name="sex" id="female"><label for="female">女</label></form></body>
</html>

e84ddb2a40ed4da1a7fef8d69cd30e91.png

此时即使我们不点击选框，点击"男"或"女"也可以实现选择的功能

注意：要将label和表单控件相关联，必须要保证表单控件的id属性值和label标签的for属性值对应

 

（4）select标签

select用于实现下拉菜单，其子标签option作为菜单的每一行，例如：

<html><head><title>页面标题</title></head><body> <form><select><option>北京</option><option>上海</option><option>广州</option><option>深圳</option></select></form></body>
</html>

47c2554cadc34323aeacd1efc650595d.png

如果在option中定义selected="selected"则表示该选项默认选中，例如：

a6cc2f889c034806813709be28c44c2f.png

此时就会默认选中广州

a7035d4dee1546d7a99c4dfd6caa040c.png

 

（5）textarea标签

可以定义一个多行的文本输入控件，例如：

<html><head><title>页面标题</title></head><body> <form><textarea rows="5" cols="20"></textarea></form></body>
</html>

79b0d98c15d44ee6b564ef5ad66fd83d.png

其中rows属性和cols属性表示一次能够显示几行几列

 

4.11 无语义标签

顾名思义，就是没有语义的标签，不需要考虑其内容，区别于前面的通过标签名就可以知道标签用途的语义化标签

无语义标签中有div标签和span标签：

  • div是块级元素，独占一行，是一个大盒子
  • span是行内元素，不独占一行，会和其他标签元素在一行显示，是一个小盒子

这两个标签主要用于网页布局

 

五、实现简单的简历展示网页

接下来是练习时间，尝试根据前面的知识来实现下面的网页吧！

8d9417974327468a8629f4a2feec5b51.png

源码如下：

<!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><div><h2>基本信息</h2><img src="https://pic.616pic.com/ys_bnew_img/00/24/50/zLfQibcVrw.jpg" width="300px"><p><span>求职意向：</span>C++开发工程师</p><p><span>联系电话：</span>XXX-XXXX-XXXX</p><p><span>邮箱：</span>xxx@qq.com</p><p><a href="https://github.com/">我的 github</a></p><p><a href="https://blog.csdn.net/">我的 博客</a></p></div><div><h2>教育背景</h2><ol><li>xxx小学</li><li>xxx初中</li><li>xxx高中</li><li>xxx大学</li></ol></div><div><h2>专业技能</h2><ul><li>熟练掌握C++</li><li>能够实现并熟练运用常见数据结构</li><li>熟知计算机网络理论</li><li>掌握Web开发能力</li></ul></div><div><h2>我的项目</h2><ol><li><h3>树洞</h3></li><p>开发时间：xxxx-xxxx</p><p>功能介绍：</p><ul><li>功能1</li><li>功能2</li></ul><li><h3>个人博客网站</h3></li><p>开发时间：xxxx-xxxx</p><p>功能介绍：</p><ul><li>功能1</li><li>功能2</li></ul></ol>    </div><div><h2>个人评价</h2><p>在校期间学习优良，绩点名列前茅，多次获得奖学金</p></div>
</body>
</html>

 

六、实现简单的简历填写页面

接下来是第二个练习，尝试根据前面的知识来实现下面的网页吧！

dd27a810215e48859e3a09664e4a9d5b.png

源码如下：

<!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><table cellspacing="0" width="600px"><thead><h3>请填写简历信息</h3></thead><tbody><tr><td>姓名</td><td><input type="text"></td></tr><tr><td>性别</td><td><input type="radio" name="sex" id="male"><label for="male">男</label><input type="radio" name="sex" id="female"><label for="female">女</label></td></tr><tr><td>出生年份</td><td><select><option>--请选择年份--</option><option>--2000--</option><option>--2001--</option><option>--2002--</option><option>--2003--</option><option>--2004--</option><option>--2005--</option></select></td></tr><tr><td>就读学校</td><td><input type="text"></td></tr><tr><td>应聘岗位</td><td><input type="checkbox" id="fe"><label for="fe">前端开发</label><input type="checkbox" id="be"><label for="be">后端开发</label><input type="checkbox" id="qa"><label for="qa">测试开发</label><input type="checkbox" id="op"><label for="op">运维开发</label></td></tr><tr><td>掌握的技能</td><td><textarea rows="7" cols="20"></textarea></td></tr><tr><td>项目经历</td><td><textarea rows="7" cols="20"></textarea></td></tr><tr><td></td><td><input type="checkbox" id="read"><label for="read">我已仔细阅读过公司的招聘要求</label></td></tr><tr><td></td><td><h3>请应聘者确认：</h3><ol><li>以上信息真实有效</li><li>能够随时上岗</li></ol></td></tr></tbody></table>
</body>
</html>

完.

 

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

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

相关文章

【vue动态组件】VUE使用component :is 实现在多个组件间来回切换

【vue动态组件】VUE使用component :is 实现在多个组件间来回切换

VUE使用component :is 实现在多个组件间来回切换 component :is 动态父子组件传值 相关代码实现&#xff1a; <component:is"vuecomponent"></component>import componentA from xxx; import componentB from xxx; import componentC from xxx;switch(…
阅读更多...
电脑f盘的数据回收站清空了能恢复吗

电脑f盘的数据回收站清空了能恢复吗

随着信息技术的飞速发展&#xff0c;电脑已成为我们日常生活和工作中不可或缺的设备。然而&#xff0c;数据的丢失或误删往往会给人们带来极大的困扰。尤其是当F盘的数据在回收站被清空后&#xff0c;许多人会陷入绝望&#xff0c;认为这些数据已无法挽回。但事实真的如此吗&am…
阅读更多...
windows server2016搭建AD域服务器

windows server2016搭建AD域服务器

文章目录 一、背景二、搭建AD域服务器步骤三、生成可供java程序使用的keystore文件四、导出某用户的keytab文件五、主机配置hosts文件六、主机确认是否能ping通本人其他相关文章链接 一、背景 亲测可用,之前搜索了很多博客&#xff0c;啥样的都有&#xff0c;就是不介绍报错以…
阅读更多...
STM32-I2C硬件外设

STM32-I2C硬件外设

本博文建议与我上一篇I2C 通信协议​​​​​​共同理解 合成一套关于I2C软硬件体系 STM32内部集成了硬件I2C收发电路&#xff0c;可以由硬件自动执行时钟生成、起始终止条件生成、应答位收发、数据收发等功能&#xff0c;减轻CPU的负担 特点&#xff1a; 多主机功能&#x…
阅读更多...
利用border绘制三角技巧

利用border绘制三角技巧

绘制三角形的效果如图 <html lang"zh-cn"> <head><meta charset"UTF-8"><title>demo</title><style>* {margin: 0;padding: 0;}.box {/* 盒子宽高改成零就变成三角形 &#xff0c;需要哪个方向的三角形就设置哪个方向…
阅读更多...
猫狗图像分类-划分数据集

猫狗图像分类-划分数据集

&#x1f4da;博客主页&#xff1a;knighthood2001 ✨公众号&#xff1a;认知up吧 &#xff08;目前正在带领大家一起提升认知&#xff0c;感兴趣可以来围观一下&#xff09; &#x1f383;知识星球&#xff1a;【认知up吧|成长|副业】介绍 ❤️如遇文章付费&#xff0c;可先看…
阅读更多...
大学教师门诊预约小程序-计算机毕业设计源码73068

大学教师门诊预约小程序-计算机毕业设计源码73068

摘要 在当今数字化、信息化的浪潮中&#xff0c;大学校园的服务管理正朝着智能化、便捷化的方向迈进。为了优化大学教师的医疗体验&#xff0c;提升门诊预约的效率和便捷性&#xff0c;我们基于Spring Boot框架设计并实现了一款大学教师门诊预约小程序。该小程序不仅提供了传统…
阅读更多...
【吊打面试官系列-MyBatis面试题】MyBatis 实现一对一有几种方式?具体怎么操作的？

【吊打面试官系列-MyBatis面试题】MyBatis 实现一对一有几种方式?具体怎么操作的？

大家好&#xff0c;我是锋哥。今天分享关于 【MyBatis 实现一对一有几种方式?具体怎么操作的&#xff1f;】面试题&#xff0c;希望对大家有帮助&#xff1b; MyBatis 实现一对一有几种方式?具体怎么操作的&#xff1f; 有联合查询和嵌套查询,联合查询是几个表联合查询,只查询…
阅读更多...
C# Application.DoEvents()的作用

C# Application.DoEvents()的作用

文章目录 1、详解 Application.DoEvents()2、示例处理用户事件响应系统事件控制台输出游戏和多媒体应用与操作系统的交互 3、注意事项总结 Application.DoEvents() 是 .NET 框架中的一个方法&#xff0c;它主要用于处理消息队列中的事件。在 Windows 应用程序中&#xff0c;当一…
阅读更多...
003-基于Sklearn的机器学习入门：回归分析（上）

003-基于Sklearn的机器学习入门：回归分析（上）

本节及后续章节将介绍机器学习中的几种经典回归算法&#xff0c;所选方法都在Sklearn库中聚类模块有具体实现。本节为上篇&#xff0c;将介绍基础的线性回归方法&#xff0c;包括线性回归、逻辑回归、多项式回归和岭回归等。 2.1 回归分析概述 回归&#xff08;Regression&…
阅读更多...
怀念旧的Windows声音？以下是如何在Windows 11中恢复它们

怀念旧的Windows声音？以下是如何在Windows 11中恢复它们

如果你渴望旧的Windows声音，希望能在Windows 11上再次听到，那你就很幸运了。我们将向你展示如何下载必要的声音包并创建复古的声音方案。 如何获取旧Windows声音的声音包 你需要做的第一件事是下载一个包含旧Windows版本声音的声音包。此外，请确保它包含的每个声音都是WAV…
阅读更多...
停车场小程序的设计

停车场小程序的设计

管理员账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;车主管理&#xff0c;商家管理&#xff0c;停车场信息管理&#xff0c;预约停车管理&#xff0c;商场收费管理&#xff0c;留言板管理 微信端账号功能包括&#xff1a;系统首页&#xff0c;停车场信息…
阅读更多...
51单片机STC89C52RC——11.1 蜂鸣器播放音乐

51单片机STC89C52RC——11.1 蜂鸣器播放音乐

目录 目的/效果 一&#xff0c;STC单片机模块 二&#xff0c;蜂鸣器 2.1 介绍 2.2 板子位置电路图 2.3 发声原理 2.4 音符和频率 三&#xff0c;创建Keil项目 四&#xff0c;代码 4.1 乐谱代码 4.1.1 《义勇军进行曲》 4.1.2 《天空之城》 4.1.3 《小美满》 4.1.…
阅读更多...
BUU CODE REVIEW 11 代码审计之反序列化知识

BUU CODE REVIEW 11 代码审计之反序列化知识

打开靶场&#xff0c;得到的是一段代码。 通过分析上面代码可以构造下面代码&#xff0c;获取到序列化之后的obj。 <?php class BUU {public $correct "";public $input "";public function __destruct() {try {$this->correct base64_encode(u…
阅读更多...
亲子时光里的打脸高手，贾乃亮与甜馨的父爱如山

亲子时光里的打脸高手，贾乃亮与甜馨的父爱如山

贾乃亮这波操作&#xff0c;简直是“实力打脸”界的MVP啊&#xff01; 7月5号&#xff0c;他一甩手&#xff0c;甩出张合照&#xff0c; 瞬间让多少猜测纷飞的小伙伴直呼&#xff1a;“脸疼不&#xff1f;”带着咱家小甜心甜馨&#xff0c; 回了哈尔滨老家&#xff0c;这趟亲…
阅读更多...
机器学习原理之 -- XGboost原理详解

机器学习原理之 -- XGboost原理详解

XGBoost&#xff08;eXtreme Gradient Boosting&#xff09;是近年来在数据科学和机器学习领域中广受欢迎的集成学习算法。它在多个数据科学竞赛中表现出色&#xff0c;被广泛应用于各种机器学习任务。本文将详细介绍XGBoost的由来、基本原理、算法细节、优缺点及应用场景。 X…
阅读更多...
如何实现一套键盘鼠标控制两台计算机（Mouse Without Borders快速上手教程）

如何实现一套键盘鼠标控制两台计算机（Mouse Without Borders快速上手教程）

需求背景 当我们需要同时使用一台主机和一台笔记本的时候&#xff0c;如果使用两套键盘和鼠标分别操作各自的系统&#xff0c;非常地不便捷且非常占据桌面空间。那么如何使用一套键盘鼠标控制两台电脑呢&#xff1f; 需求实现 软件说明 我们可以使用微软官方的一款软件Mous…
阅读更多...
阶段总结——基于深度学习的三叶青图像识别

阶段总结——基于深度学习的三叶青图像识别

阶段总结——基于深度学习的三叶青图像识别 文章目录 一、计算机视觉图像分类系统设计二、训练模型2.1. 构建数据集2.2. 网络模型选择2.3. 图像数据增强与调参2.4. 部署模型到web端2.5. 开发图像识别小程序 三、实验结果3.1. 模型训练3.2. 模型部署 四、讨论五、参考文献&#…
阅读更多...
基于springboot+vue+uniapp的电影交流平台小程序

基于springboot+vue+uniapp的电影交流平台小程序

开发语言&#xff1a;Java框架&#xff1a;springbootuniappJDK版本&#xff1a;JDK1.8服务器&#xff1a;tomcat7数据库&#xff1a;mysql 5.7&#xff08;一定要5.7版本&#xff09;数据库工具&#xff1a;Navicat11开发软件&#xff1a;eclipse/myeclipse/ideaMaven包&#…
阅读更多...
科普文：如何进行有效沟通

科普文：如何进行有效沟通

概叙 你会沟通吗&#xff1f; 你知道正确的沟通应该怎么做吗&#xff1f; 在日常生活和工作中&#xff0c;不会沟通带来的困扰是否让你感同身受&#xff1f; 在工作中&#xff0c;你是否因表达不清让观点无法被同事理解和采纳&#xff0c;影响职业发展&#xff1f; 与上级交流是…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023