标签：style 使用 pos height ima header play lang code
1、hover是鼠标移动到当前标签上时，对应的css属性生效。
padding是给a标签按上、右、下、左的顺序加上边框
hover下面的属性：
background-color: blue;当鼠标移动到使用hover的标签上时，该属性生效。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.pg-header{
position:fixed;
top:0;
right:0;
left:0;
height:48px;
background-color:#2459a2;
line-height:48px;
}
.pg-body{
margin-top:50px;
}
.w{
width: 980px;
margin: 0 auto;
}
/*padding:给menu加上样式，左右各增加10px边框*/
.pg-header .menu{
display:inline-block;
padding:0 10px 0 10px;
color:white;
}
/*当鼠标移动到当前标签上时，以下css属性才生效*/
.pg-header .menu:hover{
background-color:blue;
}
</style>
</head>
<body>
<div class="pg-header">
<div class="w">
<a class="logo">抽屉新热榜</a>
<a class="menu">首页</a>
<a class="menu">专区</a>
<a class="menu">人类发布</a>
<a class="menu">视频</a>
<a class="menu">发现</a>
<a class="menu">话题</a>
</div>
</div>
<div class="pg-body">
<div>你问我答</div>
</div>
</body>
</html>
执行结果如下：
如以上结果：
“人类发布”左右两边多了边框，是给a标签使用display属性，使其可以改变边距；
在padding属性，给其加上边框；
当鼠标放置上面时，背景变绿，这是hover的作用。
标签：style 使用 pos height ima header play lang code
原文地址：https://www.cnblogs.com/wuxiaoru/p/12373430.html
