使用边距设置跨度之间的距离
这是位于网页上的两个跨度(现实生活中有很多跨度)。我想设置它们之间的距离。我想为此使用 margin-bottom 属性,但我看不到使用它的任何影响。跨度仍处于之前的位置。那是错误的。 这是我的代码:
<!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>
<style type="text/css">
.position, .name{
overflow: hidden;
}
.position{
margin-bottom: 40px;
}
</style>
</head>
<body>
<span class="position">Designer</span><br/>
<span class="name">John Smith</span>
</body>
</html>
Here is two spans(in real life a lot of spans) situated at the web page. I would like to set the distance betwwen them. I want to use margin-bottom attribute for this, but I can't see any affect of using it. The spans are still on the previous position. That is wrong.
Here is my code:
<!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>
<style type="text/css">
.position, .name{
overflow: hidden;
}
.position{
margin-bottom: 40px;
}
</style>
</head>
<body>
<span class="position">Designer</span><br/>
<span class="name">John Smith</span>
</body>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
span
是内联元素,而不是块元素,并且它们不尊重(垂直)margin
。您可以使用填充或使范围display:inline-block;
然后使用边距。现在大多数较新的浏览器都支持后者。span
is an inline element, not a block element, and they don't respect (vertical)margin
. You can use padding or make the spandisplay:inline-block;
and then use margins. The latter is now supported in most somewhat newer browsers.我想说行高就是你正在寻找的。
I would say line-height is what you are looking for.