本文主要是介绍前端笔记-day1，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
文章目录
- 01-标签的写法
- 02-HTML的基本骨架
- 03-标签的关系
- 04-注释
- 05-标题标签
- 06-段落标签
- 07-换行与水平线标签
- 08-文本格式化标签
- 09-图像的基本使用
- 10-图像的属性
- 12-绝对路径
- 13-超链接
- 14-音频
- 15-视频标签
- 16-招聘案例
- 18-个人简历
- 19-vue简介
01-标签的写法
<strong>文字内容</strong>
<hr>
02-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>给用户看的，能看见吗？
</body>
</html>
03-标签的关系
父子关系
兄弟关系
04-注释
<!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><!-- AKLJKFNKLSACKCKKnKknknknkNKkNkn没那么 --><strong>zhegskfj</strong>
</body>
</html>
05-标题标签
<!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>jfn</h2><h3>jfj</h3><h4>sjfnkj</h4><h5>fj</h5><h6>djsb</h6>
</body>
</html>
06-段落标签
<!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>hkjfsbfjhbkfccccccccccccccccccccccccccccckjjjjjjjjjjjjjjjjjjjjjjjjfb</p><p>hkjfsbfjhbkfccccccccccccccccccccccccccccckjjjjjjjjjjjjjjjjjjjjjjjjfb</p><p>hkjfsbfjhbkfccccccccccccccccccccccccccccckjjjjjjjjjjjjjjjjjjjjjjjjfb</p></body>
</html>
07-换行与水平线标签
<!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><br>第二行<br><br><hr>
</body>
</html>
08-文本格式化标签
<!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>jiacu</strong> <br><b>kshf</b><br><em>jhcsjd</em><i>ckjnc</i><br><ins>ncjksdnc</ins><u>xiahuaxian</u><br><del>shanchu</del><s>shanchu</s>
</body>
</html>
09-图像的基本使用
<!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="./1111.jpg" ><img src="./22222.jpg" alt="">
</body>
</html>
10-图像的属性
<!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="./2222.jpg" alt="黑大衣"><img src="./1111.jpg" title="这是院人"><img src="./22222.jpg" width="100"><img src="./1111.jpg" height="300">
</body>
</html>
12-绝对路径
<!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:/anaconda/JupyterNotebook/images/bird_small.png" alt=""><img src="https://t9.baidu.com/it/u=1541335328,1353667972&fm=3035&app=3035&size=f242,150&n=0&f=JPEG&fmt=auto?s=23540B6E2BF0A8CE195C11190000E0C1&sec=1713891600&t=09ab085029a1e66d280228fc2e80a68a" alt="">
</body>
</html>
13-超链接
<!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><!-- 跳转到本地文件：相对路径查找 --><!-- target="_blank" 新窗口跳转页面 --><a href="https://www.baidu.com">百度</a><a href="./01-标签的写法.html" target="_blank">01标签写法</a><!-- 开发初期，不知道超链接的地址，href属性值写# 表示她的空连接，不会跳转 --><a href="#">空链接</a>
</body>
</html>
14-音频
<!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><!-- 在HTML5里面，如果属性名和属性值完全一样，可以简写为一个单词 --><audio src="./media/music.mp3" controls loop autoplay></audio><!-- controls:显示播放的控件 loop:循环播放 autoplay:自动播放-->
</body>
</html>
15-视频标签
<!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><video src="./media/video.mp4" controls loop muted autoplay></video><!-- controls:显示播放的控件 loop:循环播放 autoplay:自动播放（必须添加muted） muted:静音播放--></body>
</html>
16-招聘案例
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>01-案例综合案例1-招聘案例</title>
</head>
<body><h1>腾讯科技高级web前端开发岗位</h1> <hr><h2>职位描述</h2><p>负责重点项目的前端技术方案和架构的研发和维护工作；</p><h2>岗位要求</h2><p>5年以上前端开发经验，<strong>精通html5/css3/javascript等</strong>web开发技术；<br></p><p>熟悉bootstrap，vue，angularjs，reactjs等框架，熟练掌握一种以上；</p><p>代码⻛格严谨，能⾼保真还原设计稿，能兼容各种浏览器；</p><p>对web前端的性能优化以及web常见漏洞有一定的理解和相关实践；</p><p>具备良好的分析解决问题能力，能独立承担任务，有开发进度把控能力；</p><p>责任心强，思路路清晰，抗压能力好，具备良好的对外沟通和团队协作能力。</p><h2>工作地址</h2><p>上海市-徐汇区-腾云大厦</p><img src="./image.png" alt="">
</body>
</html>
18-个人简历
<!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>巨大化BJCJCMN ，。。。， <a href="./01-标签的写法.html" target="_blank">HTML5</a></p><img src="./33333.jpg" alt=""><h2>学习经历</h2><p>就你上次你看</p><h2>主要成就</h2><p>jnjsdhbc<strong>大学专业是计算机专业</strong>变成精神病的持久化<em>开启了自己的前端生涯</em><br><p>dcnknk </p></p><h2>社会任职</h2><p>女性角色本场比赛</p></body>
</html>
19-vue简介
<!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>Vue.js</h1><p>dsjbvbvjb mcnb b hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh</p><br><p>其作者是<a href="./个人简历.html" target="_blank">刘雨欣</a></p><h2>主要功能</h2><p>此技术的集成技术成就jhhhhhhhhhhhhhhhhhhhhhhhhhkkkkkkkkkkscnnnnn</p><br><p>bcjs cm mcksjnkcsdkckkkkkkkkk</p><br><p>cmjnvnnkvvkfkfk</p><video src="./video.mp4" controls></video></body>
</html>
这篇关于前端笔记-day1的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
