<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>音乐盒</title>
</head>
<style>
*{padding: 0; margin: 0; }/*将页面中所有元素的内外距设置为 0*/
.all{
width: 210px;
height: 265px;
border: 1px solid darkgray;
margin:50px auto;/*外边距 将左右边距设置为auto 可以使块级元素居中*/
text-align: center;
}
.text .header{
font-size: 18px;
font-family: "微软雅黑";
height: 40px;/*这个表格的高度*/
line-height: 40px;/*设置行高*/
border-bottom: 1px dashed #E1E1E1;/*底边框为虚线*/
}
.text p{
font-size: 14px;
color: gray;
height: 24px;
line-height: 24px;
}
</style>
<body>
<div class="all">
<div class="text">
<h2 class="header">毕业季|再见青春</h2>
<p>36557人收听</p>
</div>
<div class="image">
<img src="../img/music.jpg" alt="毕业季,再见青春" />
</div>
</div>
</body>
</html>
音乐盒
最新推荐文章于 2024-10-12 23:10:23 发布