0

我有一些文本要在其后显示一个“V”并浮动到右侧。文本是电压（因此是 V）。它有一个id并且是用 JavaScript 计算的。

我敢肯定有一种巧妙的方法可以做到这一点，但我缺乏经验，而且事情过于复杂，而且一无所获！

我试过这个：

<h3><span id="voltsSensor2"; style="float:right" >2.99</span>V</h3>

但是因为 V 在跨度之外，所以它保持在左侧。

我也尝试过让 h3 标签在 css 中全部浮动，但由于某种原因，它会将文本放在 div 区域之外，该区域是一个带有边框的框，如我的 css 中定义的那样，如本例所示：

<div class="ex">
    <h1 id = nameS1>Sensor 2</h1>
    <h2>Temperature</h2>
    <h3><span id="tempSensor2">18.5</span>&#176C</h3>

    <div style="width:255px; height:13px; background-color:#ddd;">
        <div id ="barTempS2" style="width:60px; height:13px; background-color:#366; border-right:1px white solid;"></div>
    </div>

    <h2>Humidity</h2>
    <h3><span id="humSensor2">55.0</span>%RH</h3>

    <div style="width:255px; height:13px; background-color:#ddd;">
        <div id ="barHumS2" style="width:140px; height:13px; background-color:#366"></div>
    </div>

    <h4><span id="voltsSensor1">2.99</span>V</h4>
    <img src="images/greyCornerRhb.png" width="12" height="12" alt="Sensor Name"; style="float:right">
</div>

我敢肯定有一个更简单的方法。我将不胜感激。

4

3 回答 3

3

您应该只text-align: right;在父元素上使用 a 并丢失float.

于 2012-11-13T12:59:43.740 回答
1

尝试这个：

<h3 style="float:right"><span id="voltsSensor2">2.99</span>V</h3>
<div style="clear: both"></div>

JSFiddle：http: //jsfiddle.net/BJPUv/

div将clear:both允许浮动元素的高度，因此它们不会浮出 div。

于 2012-11-13T12:58:40.577 回答
0

你可以很容易地做两件事。要么将 V 粘贴在它自己的跨度中，并为两个跨度指定 position:relative 和 float:right 。或者只是将 V 粘贴在数字的范围内。计算完值后，您可以在 js 代码中附加“V”。

于 2012-11-13T12:59:13.927 回答