前端怎么让两个文字之间留一些空间（距离）前端大神来帮忙

浮云疮狗 2015-10-14 04:34:40

这是我实现的方法用空格但是好不美观而且很麻烦
用span又出不来效果

...全文

725 20 打赏收藏转发到动态举报

写回复

用AI写文章

20 条回复

切换为时间正序

请发表友善的回复…

发表回复

cqq_相公 2015-10-27

打赏
举报

letter-spacing:2px 字体间距

zhang1lang4 2015-10-27

打赏
举报

前者<div style="width:300px;display:inline;"></div>后者不对

zhang1lang4 2015-10-27

打赏
举报

前者<div style="width:300px;display:inline;"></div>后者

落泪的只有我 2015-10-23

打赏
举报

引用 10 楼 qq_25388339 的回复:

那怎么样控制距离呢比如说我只想他们相隔300px 而不是靠左或靠右

okkk 2015-10-21

打赏
举报

margin-left

sunmeng0109 2015-10-19

打赏
举报

使用letter-spacing把，你可以去试试，不过一般文字小间距就用这个!

香蕉猪 2015-10-19

打赏
举报

为文字加font标签，，，，然后设置padding,margin....

lidongyalin 2015-10-18

打赏
举报

letter-spacing 改变字符间距去试试

风中的少年 2015-10-16

打赏
举报

margin-left 或 margin-right

浮云疮狗 2015-10-16

打赏
举报

那怎么样控制距离呢比如说我只想他们相隔300px 而不是靠左或靠右

旋雨沐 2015-10-16

打赏
举报

1,float:left;或position:absolute; 2,设margin-left或margin-right.padding-left或padding-right; 3，添加一个空元素设定宽度为300px; 看你的布局建议选用第一种，因为前面的部分可能不是定长的，第一种比较好些

风中的少年 2015-10-15

打赏
举报

7 楼是个好方法。也可以如下设计 <ul> <li>。。。。添加页面</li> <li><a href="javascript:;">增加种质资源</a></li> </ul> 然后样式: 第一个li 左浮动，第二个 li 右浮动，给position : relative li 下的a 还可以相对于它的li 定位。。。。position : absolute; 设置 left, top 就好了。

qq_22724965 2015-10-14

打赏
举报

用列表，ul li 然后设置margin

街头小贩 2015-10-14

打赏
举报


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Swapping Songs</title>
<style type="text/css">
body,dl,dd,dt{margin:0;padding:0}
        nav{width:100%;height:50px;line-height:50px;background-color:#f1f1f1}
        nav dl{display:inline-block;margin-left:10%}
        nav dd,nav dt{display:inline;}
        nav dt:after{
                content:":";
        }
        nav dd:after{
                content:">";
        }
        nav dd:last-child:after{
                content:"";
        }
        nav>a{float:right;margin-right:10%}
</style>
</head>
<body>
        <nav>
                <dl>
                        <dt>当前位置</dt>
                        <dd>主页</dd>
                        <dd>添加页面</dd>
                </dl>
                <a href="javascript:;">增加种质资源</a>
        </nav>

</body></html>

baidu_32012985 2015-10-14