创建与CSS等效的选项卡，同一行的第一个条目
创建与CSS等效的选项卡，同一行的第一个条目
提问于 2014-08-13 00:31:18
我正在尝试做一些在文字处理方面非常经典的事情，但在CSS中显然不那么常见。我正在把电影信息放到一个网站上，并且想要像这样格式化信息：
主任：
Cast：
商业、商业、金融、商业、金融、金融等行业的商业、金融、商业、金融、金融等行业。
商业、商业、金融、商业、金融、金融等行业的商业、金融等行业的商业、金融、金融等领域。
作者：
是啊，那我该怎么做呢？问题是，我试图将标题(导演、演员等)的格式与常规文本不同。我现在要说的是：
<div>
<h3>Director: <span style="font-weight:300;">John Carney</span></h3> <h3>Writer: <span style="font-weight:300;">John Carney</span></h3>
<h3>Cast: <span style="font-weight:300;">Keira Knightley<br>Mark
Ruffalo</span></h3>
</div> 感谢任何帮助，谢谢！
回答 5
Stack Overflow用户
回答已采纳
发布于 2014-08-13 00:55:19
按照@vch的建议，把它建立在描述表上怎么样？
演示：http://jsfiddle.net/dt2v7zys/2/
<dl>
<dt>Director:</dt>
<dd>John Carney</dd>
<dt>Writer:</dt>
<dd>John Carney</dd>
<dt>Cast:</dt>
<dd>
<ul>
<li>Keira Knightley</li>
<li>Mark Ruffalo</li>
</ul>
</dd>
</dl>用..。
dt {
float: left;
width: 80px;
padding: 4px;
}
dd {
margin-left: 88px;
padding: 4px;
}或者，一个dt可能有多个定义/描述它的dd值，例如：
演示：http://jsfiddle.net/dt2v7zys/1/
<dl>
<dt>Director:</dt>
<dd>John Carney</dd>
<dt>Writer:</dt>
<dd>John Carney</dd>
<!-- note the multiple values for a single dt -->
<dt>Cast:</dt>
<dd>Keira Knightley</dd>
<dd>Mark Ruffalo</dd>
<dt>Producer:</dt>
<dd>Another Guy</dd>
</dl>Stack Overflow用户
发布于 2014-08-13 00:37:13
我想你需要一个定义列表：<dl>, <dt>, <dd>。有一些例子，包括css 这里。
Stack Overflow用户
发布于 2014-08-13 00:39:50
你可以这样做：
<div>
<h3><span>Director:</span>John Carney</h3>
<h3><span>Cast:</span>Keira Knightley<br>Mark Ruffalo</h3>
<h3><span>Writer:</span>James Smith</h3>
</div>然后在样式表中：
h3 {
font-weight: normal;
padding-left: 200px;
}
h3 span {
display: inline-block;
min-width: 200px;
height: 100%;
font-weight: bold;
margin-left: -200px;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25276282
复制相关文章
相似问题
腾讯云开发者
