标签：mamicode 需要 har 时间 alt html 意思 链接 回收站
2018年9月我升入了大学，也在同年的十月加入到了我们学校的科协，也就在这时我开始接触前端。一开始的时候是为了通过部门笔试开始看菜鸟教程，菜鸟教程讲的很清晰，每个标签的功能以及其的属性。我的第一个编辑器是Notepad++（对小白很友好，但是听说其开发者是个极端分子，默默的把它丢入回收站）
以下这段代码便是每个前端初学者的必经之路了
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> </body> </html>
HTML是前端的主要语言，它的全称是Hypertext Maekup Language,也叫做超文本标记语言，是一种用来结构化Web网页的一种标记语言，用一个人来比喻的话HTML就是人的骨架，是支撑Web网页的重要部分，刚开始接触的时候，我以为这会像C语言一样，需要一些逻辑，但是在慢慢的接触下，我发现其实它很简单，HTML的标签是较为语义化的，head的意思是头部，那么<head>标签的作用就和人的头一样，控制着思维；那么代表着身体的<body>标签则就意味着它的部分是让我们在Web页面中看到的东西。
接着所需要学到的东西就是它的一些主要标签了，刚开始的小白用的最多的就是段落标签<p>以及链接标签<a>了。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <p>Hey! 我是一个段落</p> <a href="https://www.baidu.com/">百度一下</a> </body> </html>
在<a>标签中除了默认的“href”链接属性之外还有target属性——定义链接的文档在何处显示；“id”属性——定义链接的书签标记。
还有以下一些常用标签
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <h1>我是1号标题</h1><!--标题（最大）--> <h2>我是2号标题</h2><!--标题（次大）--> <b>粗体</b><!--定义着重文字--> <strong>粗体</strong><!--定义着重文字--> <i>斜体</i><!--定义着重文字--> <em>斜体</em><!--定义着重文字--> <img src="url" alt="当图片无法加载时所替换的文字" height="高度" width="宽度" align="对齐方式"><!--插入图片--> <table><!--表格--> <tr><!--行--> <td></td><!--列--> <td></td> </tr> <tr> <td></td> <td></td> </tr> </table> </body> </html>
从以上所展示的标签可以看出，每个标签都是成对出现的，一个标签对应一个闭标签，但是也存在单标签的，例如上述代码的<img>标签。
列表也是HTML的一项重要标签
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <ul> <!--无序列表--> <li>1</li> <li>2</li> </ul> <ol> <!--有序列表--> <li>1</li> <li>2</li> </ol> </body> </html>
就得到了上图的效果。
但是，制作一个网页不可能就一味的无脑将标签丢上去，也需要合理的布局，那么块级元素的存在就显得十分的重要了，大多数的HTML元素都被定义为块级元素或是内联元素。块级元素在浏览器显示时，通常会以新的一行来开始（和结束）例如：<h1>、<p>、<ul>、<table>等;而内联元素则不会以新的一行开始，例如：<b>、<td>、<a>、<img>等。其中<div>标签是个典型的块级元素，它能把文档分割成独立的不同的部分；<span>标签则是典型的内敛元素，可作为文本的容器。
在初学HTML的时候这些便是需要掌握的基本功，只有打好了这些基础才能为之后的网页开发提供便利。虽说HTML不像C语言一样注重逻辑，但是也需要多多实践，多做几个demo就可以看出这些标签中的小秘密。这是我写的第一篇博客，也是我学习前端网页知识一年的时间，这篇博客是从我初学HTML的一些总结，希望能对初学的小白提供一点自己的见解，如有漏洞，也请斧正。
标签：mamicode 需要 har 时间 alt html 意思 链接 回收站
原文地址：https://www.cnblogs.com/lzezzxy/p/12165201.html
