html5将div中的文字变大，文字为什么会下移？截图代码如下要怎么改
发布网友
发布时间：2022-04-23 09:34
共3个回答
热心网友
时间：2023-10-09 15:59
对span设置一个display：block；就行了，还有就是要设置margin：0；padding：0；
或者直接把span换成块标签
还有就是给25套个标签，然后宽度设置100%也行
热心网友
时间：2023-10-09 15:59
<style type="text/css">
*{margin:0;padding:0;}
.date {
width:320px;
height: 160px;
line-height:160px;
background: #fcfcfc;
background: linear-gradient(top, #fcfcfc 0%,#dad8d8 100%);
background: -moz-linear-gradient(top, #fcfcfc 0%, #dad8d8 100%);
background: -webkit-linear-gradient(top, #fcfcfc 0%,#dad8d8 100%);
border: 1px solid #d2d2d2;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
-webkit-box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
}
.date p {
font-family: Helvetica, sans-serif;
font-size: 100px; text-align: center; color: #9e9e9e;
}
</style>
<body>
<div class="date">
<p>25<span>May</span></p>
</div>
很多标签默认是有边距的，写CSS前记得先清空一下。
HTML标签CSS默认属性值大全：http://blog.sina.com.cn/s/blog_6a3c6f810100ydiy.html
热心网友
时间：2023-10-09 16:00
<!DOCTYPE html>
<html lang = "zh">
<meta charset = "UTF-8">
<style type="text/css">
.date {
width: 130px; height: 160px;
background: #fcfcfc;
background: linear-gradient(top, #fcfcfc 0%,#dad8d8 100%);
background: -moz-linear-gradient(top, #fcfcfc 0%, #dad8d8 100%);
background: -webkit-linear-gradient(top, #fcfcfc 0%,#dad8d8 100%);
border: 1px solid #d2d2d2;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
-webkit-box-shadow: 0px 0px 15px rgba(0,0,0,0.1);
position:relative;
}
.date p {
font-family: Helvetica, sans-serif; text-align:center; font-size:80px; color:#9e9e9e;
position:absolute; top:-90px; left:0px;
}
.date p span{ display:block;}
</style>
<body>
<div class="date">
<p>25<span>May</span></p>
</div>
</body>
</html>
这样可以吗
