1. 此篇文章讲解目录：

• 案例和由此案例重点讲解的知识点介绍

• 案例代码实现

• 行内标签知识点详解

2. 案例和相关知识点介绍

此案例是页面，效果如下：

此页面的技术实现解析：

所有元素在统一行显示的时候，需要使用到行内标签img 和 a来实现

此案例中主要用到了，基于此，我们会系统的将如下知识点全部讲解：

行内标签

3. 此案例的代码实现

第一步：书写导航条的html代码

第二步：定义导航的css样式

4. 此案例的知识点详解

行内元素

-行内元素：

在html中<a>、<span>、<br>、<i>、<em>、<strong>、<label>等等属于行内元素

-行内元素三大特点：

1、和其他元素都在一行上；

2、元素的高度、宽度、行高及顶部和底部边距不可设置；

3、元素的宽度就是它包含的文字或图片的宽度，不可改变（废话）。

案例：

a{

background-color: PowderBlue;

width: 500px;

height: 300px;

//元素的高度、宽度、行高及顶部和底部边距不可设置

}

大家好接下来我们会邀请前端架构师以连载的方式，并且结合阿里天猫商城的门户，系统讲解Css的专业知识，欢迎大家关注头条号“互联网IT信息”。