Basics of front-end entry, summary of HTML controls

//Use vs-code to automatically generate the basic structure of an html file
//title tag

h1

h2

h3

h4

h5
h6
// You can't display the newline directly in html, you must use the newline tag br to do it, and wrap it in angle brackets//
hr is the dividing line label
//hyperlink label
   <!-- href属性是必须的,没有href属性就会失去超链接的功能,网址前要加HTTP协议,
    target="_blank"用新网页打开 -->
    
    <!-- 网页跳转 --> 
<a href="http://www.baidu.com" target="_blank">跳转到百度</a>
<!-- 内部跳转 -->
<a href="./招聘页面.html" target="_blank">跳转到招聘页面</a>
<!-- 空连接,不知道跳转目标,用#代替 -->
<a href="#" >不跳转</a>
<!-- 假链接,只要小手的手形,不跳转 href值设置成javascript:; -->
<a href="javascript:;">hhhh</a>
<!-- 下载链接 :href属性值设置为一个压缩包-->
<a href="./images/images.zip">下载图片</a>

   <!--视频标签常用属性:
		    src属性:查找视频的路径  
		    autoplay属性:自动播放属性,高版本浏览器一般都是禁止播放的
		    muted属性:用来解决低版本浏览器不能自动播放的问题
		    loop属性:循环播放
		    controls属性:*播放控件,不同浏览器会有不同的样式,后期用js控制 -->

<video src="./images/video.mp4" controls autoplay muted loop>
</video>
//音频标签,属性和视频标签相似
  <audio src="./images/music.mp3" controls autoplay loop>
  </audio>
  
  <!-- 文本格式化标签,一行放多个 -->
<!-- b strong 加粗      i em 倾斜      u ins 下划线     s del 删除线 -->
<b>小明</b>是<i>世界</i>上<u>最好</u>的<s>人儿</s>!<br>
<strong>小明</strong>是<em>世界</em>上<ins>最好</ins>的<del>人儿</del>!
The above introduces the basic front-end tags, and then comes a comprehensive exercise. 招聘页面

Senior web front-end development position at Tencent Technology


job description

Responsible for the development and maintenance of the front-end technical solutions and architecture of key projects;

<h3>岗位要求</h3>
<p>5年以上前端开发经验, 精通html5/css3/javascript等 web开发技术;</p>

<p>熟悉bootstrap,vue,angularjs,reactjs等框架,熟练掌握一种以上;</p>

<p>代码⻛格严谨,能⾼保真还原设计稿,能兼容各种浏览器;</p>

<p>对web前端的性能优化以及web常见漏洞有一定的理解和相关实践;</p>

<p>具备良好的分析解决问题能力,能独立承担任务,有开发进度把控能力;</p>

<p>责任心强,思路路清晰,抗压能力好,具备良好的对外沟通和团队协作能力。</p>

<h3>工作地址</h3>
<p>上海市-徐汇区-腾云大厦</p>
<img src="images/map.jpg" alt="图片不见了">
Summary of today's study outline: ![Insert picture description here](https://img-blog.csdnimg.cn/32ef2fa2ea94488aa4e47adad2c04682.jpeg#pic_center) ![Insert picture description here](https://img-blog.csdnimg .cn/c61a462f71824726850a7e8df2977f11.jpeg#pic_center) ![Insert picture description here](https://img-blog.csdnimg.cn/d9a7f149e8674ab8870bea792cecf9b8.jpeg#pic_center)

That's all for today's introduction, follow me, update daily, let's learn the front end together~

Guess you like

Origin blog.csdn.net/Rosia629/article/details/127309624