菜鸟html教程
文章导读：本期小编就给各位初学html语言的小伙伴带来菜鸟html教程，在下文中小编整理了一些常用的html标签，希望对那些正在学习html的小伙伴有所帮助。除此之外，小编还整理了多个html学习链接，以便帮助你更好的进行学习。感兴趣的小伙伴就来看一看吧！
本期小编就给各位初学html语言的小伙伴带来菜鸟html教程，在下文中小编整理了一些常用的html标签，希望对那些正在学习html的小伙伴有所帮助。除此之外，小编还整理了多个html学习链接，以便帮助你更好的进行学习。感兴趣的小伙伴就来看一看吧！
html常用标签
一、首先来讲第一种：标题标签 h1~h6
<h1>一级标题</h1> <h2>二级标题</h2> <h3>三级标题</h3> <h4>四级标题</h4> <h5>五级标题</h5> <h6>六级标题</h6>
标题标签的默认样式是自动加粗的;字体大小一级标题最大，六级最小;标题与标题之间有较大的间距 独占一行。
标题标签代表着一个标题，一级标题的语义最重，六级标题的语义最轻。
标题标签是块元素。
标题标签的作用是帮助推广部门进行推广优化的，其重要性仅次于title标签。一般而言一个页面只有一个h1标签。
二、第二种：段落标签 p
<p>段落标签</p>
段落标签的默认样式是行与行之间有较大间距并独占一行。它代表着一个自然段。
段落标签也是块元素。
三、第三种：hgroup标签
<hgroup> <h1>登高</h1> <h2>杜甫</h2> </hgroup>
hgroup标签主要作用是用来为标题分组，可以将一组相关的标题放到hgroup里面。
四、第四种：强调标签 em strong
你们真<em>帅</em> 你们真<strong>帅</strong>
em和strong标签都表示强调，但是它们还是有一定的差别的
1、第一em标签的样式是斜体，而strong标签的样式是加粗
2、第二em标签是强调语义的，而strong标签是强调内容的
em标签和strong标签都是行内元素。
五、第五种：引用标签 q blockquote
老子曰 <blockquote>孔子说的不对</blockquote> 孔子曰 <q>老子才不对</q><br>
q标签和blockquote标签都是引用，不同的是q标签是短引，用而blockquote标签是长引用会换行的。
六、第六种：换行标签 br
点点关注<br> 谢谢你们<br> 萨瓦迪卡<br> 外比八不<br>
br标签的作用是，强制换行，它是一个自结束标签。
七、第七种：hr标签
<hr>
hr标签就是给页面加一个分割线。
八、第八种：del标签
原价 <del>19999</del> 现价 999
这个del标签就是删除标签，就很常见了，什么不要998，不要997现价只有99!等等的广告，还有淘宝上啊、京东上啊，都有这个标签的存在。
九、第九种：center标签
<center> <hgroup> <h1>登高</h1> <h2>杜甫</h2> </hgroup></center>
center标签的作用就是剧中，把文字啊图片啊啥的全部居中到页面中间，这可以让页面更美观。
十、第十种：div标签
<div> 用来布局 </div>
div标签是用来布局的，并没有语义，只是一个区块。
div标签是块元素
十一、第十一种：span标签
<span> 包裹文字 </span>
span标签，没有语义，一般用来包裹文字,让文字更好被选中。
常用的布局标签
header 网页的头部
main 网页的主体部分(一般只有一个)
footer 网页的底部
nav 网页的导航
aside 和主题相关的内容
article 文章之类的
section 独立的块区，上面的标签都不合适，就用这个
div 块元素
常用的图片标签
一般来说我们都是使用img标签来引入图片，img标签有四个属性
1.src属性 引入图片路径 通过./或者../开头
./ 若引用的图片在同一个目录下
../ 若引用图片不在同一个目录(../到上一级目录，可叠加../../)
2.alt属性 对图片的描述，对图片引用不成功的时候显示文字
也会帮助浏览器做一些收录功能
3. width属性 设置图片的宽度
属性值里直接写数值或者带单位
4.height属性 设置图片的高度
属性值里直接写数值或者带单位
注意：一般情况 width和height只设置一个，另一个让浏览器按比例缩放。
行内元素和块元素
想必大家都看到文章中有很多行内元素和块元素被标记出来了吧，是不是不太清楚是什么，没关系现在我就来给大家说一说
块元素(block element) 常用来布局
特点：
1.块元素会独占一行,从上往下依次排列
2.块元素的宽度是父元素的100%(body是父元素，页面边小随之变小)
3.块元素的高度默认是被内容撑开的
常用块元素：div h1-h6 p header footer nav......
行内元素(inline element)
特点
1.不会独占一行，它是自左向右排列，一行排满再换行
2.行内元素的宽和高，默认是被内容撑开的
常用行内元素：span em strong a i ......
行内块元素
特点
1.兼具块元素和行内元素特点
2.不会独占一行，可自定义宽高
注意：
1.块元素里什么都能放，可以是块元素，行内元素，行内块元素
2.行内元素里一般只放行内元素，如：文字，不能放块元素
3.特殊的块元素p标签它里面一般只放文字或者图片，不能放块元素
4.特殊的行内元素a标签，它里面什么都能放，可以块元素，行内元素，行内块元素，除了a标签它自己不能放进去。
相关html学习网站
1、【菜鸟教程】>>>>>点此开始学习html
2、【w3cschool】>>>>>点此开始学习html
ps：本文部分转自：https://blog.csdn.net/rbh200812/article/details/125996971，版权归原作者所有！
以上就是菜鸟html教程-html常用标签大全的全部内容了，了解更多教程请持续关注173软件站!
