前端入门 HTML常用标签

HTML常用标签

标题标签

<h1>-<h6>

单词head的缩写，意为头部、标题。

<h1>我是一级标题</h>

*标签语义：*作为标题使用，并且依据重要性递减。
特点：

1. 加了标题的文字会变的加粗，字号也会依次变大。
2. 一个标题独占一行。
   段落标签

<p>我是一个段落标签</p>

*标签语义：*可以把HTML文档分割为若干段落。
特点:

1. 文本在一个段落中会根据浏览器窗口的大小自动换行。
2. 段落与段落之间保有空隙。

换行标签

<br/>

*标签语义：*强制换行。
特点：

1. 
   是个单标签。
2. 
   标签只是简单的开始新的一行，跟段落不一样，段落之间会插入一些垂直的间距。
   文本格式化标签
   
   加粗<strong></strong>
   倾斜<em></em>
   删除线<del></del>
   下划线<ins></ins>
   盒子内容标签（形象化）

<div>这是头部</div>
<span>今日价格</span>

div是divsion的缩写，表示分割、分区。
span意为跨度、跨距。
特点：

1. <div>标签用来布局，但是现在一行只能放一个<div>,大盒子。
2. <span>标签用来布局，一行上可以多个<span>,小盒子。
   图像标签

<img src="图像URL"/>

src是<img>标签的必须属性，它用于指定图像文件的路径和文件名。
所谓属性:简单理解就是属于这个图像标签的特性。
图像标签的其他属性

src：必须属性
alt ：替换文本，图像不能显示的文字
title:提示文本，鼠标放到图像上，显示的文字
width:设置图像的宽度
height:设置图像的高度
border: 设置图像的边框粗细
图像标签属性注意点：

• 图像标签可以拥有多个属性，必须写在标签名的后面。
• 属性之间不分先后顺序，标签名与属性、属性与属性之间均以空格分开。
• 属性采取键值对的格式，即key="value"的格式，属性=“属性值”。
  图像标签和路径
  相对路径：以引用文件所在位置为参考基础，而建立出的目录路径。

相对路径是从代码所在的这个文件出发，去寻找目标文件的，而我们这里所说的上一级、下一级和同一级就是图片相对于HTML页面的位置。
绝对路径是指目录下的绝对位置，直接到达目标位置，通常是从盘符开始的路径。
“http://www.baidu.com".
超链接标签
链接的语法格式

<a href="跳转目标"target="目标创口的弹出方式">文本或图像</a>

链接分类：

• 外部链接：<a href="http://www.baidu.com">百度</a>.
• 内部链接：网站内部页面之间的相互链接，直接链接内部页面名称即可，<a href="index.html">首页</a>.
• 空链接：如果当时没有确定链接目标时，<a href="#">首页</a>.
• 下载链接：如果href里面地址是一个文件或者压缩包，会下载这个文件。
• 网页元素链接：在网页中的各种网页元素，如文本、图像、表格、音频、视频等都可以添加超链接。
• 锚点链接：点我们点击链接，可以快速定位到页面中的某个位置。

1. 在链接文本的href属性中，设置属性值为#名字的形式，<a href="#two">第2集</a>
2. 找到目标位置标签，里面添加一个id属性=刚才的名字，<h3 id="two">第2集介绍</h3>