一、结构标签:
标签名 | 定义 | 说明 |
---|---|---|
<html></html> | HTML标签 | 页面中最大的标签,称为根标签 |
<head></head> | 文档的头部 | 注意在head标签中我们必须要设置标签是title |
<title></title> | 文档的标题 | 让页面拥有一个属于自己的网页标题 |
<body></body> | 文档的主体 | 元素包含文档的所有内容,页面内容基本都是放在body里 |
二、标题标签:
为了使网页具有语义化,HTML提供了6个等级的网页标题,即:<h1>-<h6>
<h1>我是一级标签</h1>
<h2>我是二级标签</h2>
...
<h6>我是六级标签</h6>
标签语义:作为标签使用,并且依据重要性递减。
特点:
1、标题的文字会变大加粗,字号也会依次变大;
2、标题独占一行。
三、段落和换行标签:
在网页中,要把文字有条理地显示出来,就需要将这些文字分段显示。在HTML标签中,<p>标签用于定义段落,它可以将整个网页分为若干个段落。
<p>我是一个段落标签</p>
标签语义∶可以把HTML文档分割为若干段落。
特点︰
1、文本在一个段落中会根据浏览器窗口的大小自动换行;
⒉、段落和段落之间保有空隙。
在HTML中,一个段落中的文字会从左到右依次排列,直到浏览器窗口的右端,然后才自动换行。如果希望某段文本强制换行显示,就需要使用换行标签<br />.
特点∶
1、<br />是个单标签;
2、<br />标签只是简单地开始新的一行,跟段落不一样,段落之间会插入一些垂直的间距。
四、文本格式化标签
在网页中,有时需要为文字设置粗体、斜体或下划线线等效果,这时就需要用到HTML中的文本格式化标签,使文字以特殊的方式显示
标签语义:突出重要性,比普通文字更重要。
语义 | 标签 | 说明 |
加粗 | <strong></<strong>或者<b></b> | 推荐使用<strong>标签 语义更强烈 |
倾斜 | <em></em>或者<i></i> | 推荐使用<em>标签 语义更强烈 |
删除线 | <del></del>或者<s></s> | 推荐使用<del>标签 语义更强烈 |
下划线 | <ins></ins>或者<u></u> | 推荐使用<ins>标签 语义更强烈 |
五、<div>和<span>标签
<div>和<span>是没有语义的,它们就是一个盒子,用来装内容的。
<div>这是头部</div>
<span>今日价格</span>
特点∶
1.<div>标签用来布局,但是现在一行只能放一个<div>。大盒子
2.<span>标签用来布局,一行上可以多个<span>。小盒子
六、图像标签:
在HTML标签中,<img>标签用于定义HTML页面中的图像。
例:<img src="图像URL"/>
属性 | 属性值 | 说明 |
---|---|---|
src | 图片路径 | 必须属性,用于指定图像文件的路径和文件名 |
alt | 文本 | 替换文本,图像不能显示的文字 |
title | 文本 | 提示文本,鼠标放在图像上,显示文字 |
width | 像素 | 设置图像的宽度 |
height | 像素 | 设置图像高度 |
border | 像素 | 设置图像的边框粗细 |
七、链接标签:
1、外部链接:
<a href="http://www.baidu.com">百度</a>
2、内部链接:网站内部页面之间的相互链接,直接链接内部页面名称即可。
<a href="index.html">首页</a>
3、空链接:如果当时没有确定链接目标时。
<a href="#">首页</a>
4、下载链接:如果href里面地址是一个文件或者压缩包,会下载这个文件。
5、网页元素链接:在网页中各种网页元素,如文本、图像、表格、音频、视频都可以添加超链接。
6、锚点链接:点我们点击链接,可以快速定位到页面中的某个位置。
●在链接文本的href属性中,设置属性值为 “#名字’的形式,如:<a href="#two">第二集</a>
●找到目标位置标签,里面添加一个id属性=刚才的名字,如:<h3 id="two">第二集</h3>
八、注释标签
如果需要在HTML文档中添加一些便于阅读和理解但又不需要显示在页面中的注释文字,就需要使用注释标签。HTML中的注释以“<!--”开头,以“-->”结束。
<!--注释语句-->
快捷键: ctrl +l
注释标签里面的内容是给程序猿看的,这个代码是不执行不显示到页面中的.