Html 如何在DIV中添加两行文本

我有以下代码（CSS是内联的，但一旦测试完成，它将被移动到指定的文件）：

紧急护理
今天的日期

显示以下内容：

如何修改CSS，使这两行看起来像是顶部的紧急护理，下面是今天的日期？

演示：

简单地说：

将

行高更改为
15px

在两个文本部分之间添加

---

若你们想要一个在另一个之上，你们可能想要这个：

紧急护理
今天的日期

您需要一些Jquery来实现这一点

演示

Jquery

var currtime = new Date();
var currdate = new Date();

currdate = (currdate.getMonth()+ 1) + '/' + currdate.getDate() + '/' + currdate.getFullYear(); 

currtime = (currtime.getHours() + ":"+ currtime.getMinutes());

$("#message").html("");
$("#message").html( "URGENT CARE<br />" + currdate + " " + currtime);

var currtime=新日期（）；
var currdate=新日期（）；
currdate=（currdate.getMonth（）+1）+'/'+currdate.getDate（）+'/'+currdate.getFullYear（）；
currtime=（currtime.getHours（）+：“+currtime.getMinutes（））；
$（“#消息”）.html（“”）；
$（“#message”）.html（“紧急护理
“+currdate+”+currtime）；

您的代码已经完成了这项工作，除了您需要将第三部分的行高更改为15px。顺便说一句，您缺少第一部分的结束标记。

。。。这就是你问的

<div style="... "> 
    <div style="...">
        <div style="...line-height: 15px">
          URGENT CARE
          TODAY'S DATE
        </div>
    </div>
</div>

你也可以考虑把部门名称和日期稍微不同的尺寸和颜色区分开来。与其将它们放在一个混乱的中心，以防部门名称必须换行，不如将它们左对齐，但将它们放在父分区的中心。使用边距将它们彼此分开&父分区的边缘。您可以为

font size

保留固定的像素值，或使用

em

进行动态大小调整

CSS:

---

你能再解释一下你想要实现什么吗？不清楚。在“Care”之后使用

标记如何？当前日期无法用html/css检索，您需要使用js在客户端或使用php/asp.net或similar@andrew非常感谢。它还是一个占位符：）你试过堆栈片段吗？考虑灵活性/可扩展性的要点。OP的问题实际上是行高，但是没有演示和数据示例，这个答案有助于覆盖OP接下来可能遇到的最常见的障碍，防止在此答案下重新编辑和评论问题。哇。。。非常感谢。这真的做得很好！

<div style="... "> 
    <div style="...">
        <div style="...line-height: 15px">
          URGENT CARE
          TODAY'S DATE
        </div>
    </div>
</div>

<div style="width: 100%; overflow: hidden; "> 
    <div style="float: left; width: 15%; height: auto; line-height: 30px; vertical-align: middle; background: #FF00FF; padding: 0; margin: 0; border-top-left-radius: 10px; border-bottom-left-radius: 10px; font-family: Verdana; font-size: 9px; overflow: hidden; text-align: center;">
        <div style="text-align: center; width: 90%; padding: 0 0 0 10%; margin: 0 auto; overflow: hidden; line-height: 15px; background-color:#ff00ff">
          <span id="dept_name" class="pretty_span">REALLY LONG MEDICAL DEPARTMENT NAME</span>
          <span id="todays_date" class="pretty_span">TODAYS DATE</span> <!-- NEXT LINE CENTERED UNDERNEATH "URGENT CARE" -->
        </div>
    </div>
</div>

.pretty_span{
    display: block;
    text-align: left;
}

#dept_name{
    margin: 0.6em 0 0.6em 0;
    color: #FFFFFF;
    font-size: 1.1em;
}

#todays_date{
    font-size: 0.9em;
    color: #ccc;
    margin-bottom: 0.6em;
}