0

如何设置这些 div 的样式,以便它们显示在没有项目符号的 1 行上?

<div>
Copyright (c) 2013 Acme Inc. All rights reserved.
</div>

<div>
<ul>
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Terms &amp; Conditions</a></li>
</ul>
</div>

示例:版权 (c) 2013 Acme Inc. 保留所有权利。隐私政策条款和条件

4

2 回答 2

1
<html>
<body>
<div style="display:inline">
Copyright (c) 2013 Acme Inc. All rights reserved.
</div>

<div style="display:inline">
<ul style="display:inline">
<li style="display:inline"><a href="#">Privacy Policy</a></li>
<li style="display:inline"><a href="#">Terms &amp; Conditions</a></li>
</ul>
</div>
   </body>
</html>
于 2013-01-22T22:34:48.770 回答
1

您应该向<ul>或 父级添加一个类<div>

<div class='copyright'>
Copyright (c) 2013 Acme Inc. All rights reserved.
</div>
<ul class='footer'>
     <li><a href="#">Privacy Policy</a></li>
     <li><a href="#">Terms &amp; Conditions</a></li>
</ul>

然后调整CSS:

.footer {
    list-style-type: none;
    display: inline;
}

.footer li, .copyright {
    display: inline;
}    

或者

.footer li, .copyright {
    display: inline-block;
}

或者

.footer li, .copyright {
    display: block;
    float: left;
}

添加课程.footer是非常可选的,但我认为非常推荐。您可以简单地将 css 选择器调整为ul { list-style-type: none; }ul li { ... }

但老实说,你为什么不简单地使用它呢?

<div>
 Copyright (c) 2013 Acme Inc. All rights reserved.
 <a href='#'>Privacy Policy</a> 
 <a href='#'>Terms &amp; Conditions</a>
</div>
于 2013-01-22T22:28:39.060 回答