如何在 HTML 中的同一行中有 2 种字体大小的文本？

Question

我正在使用引导程序和基本 HTML 代码开发前端 HTML 页面。我需要打印特定产品的价格，比如 63 美元。 我希望它在同一行，但 $ 的大小需要小于数字。我如何实现这一目标？

Answer 1

 span { font-size: 3em;}
 span b { font-size: 60%; font-weight: normal }

<span><b>$</b>63</span>

---

您还可以避免使用嵌套元素来包装货币符号并使用

::first-letter

伪类对其进行样式设置，但这需要

block

或

inline-block

父元素，例如

span { 
   font-size: 3em; 
   display: inline-block; }

span::first-letter { font-size: 60%; }

<span>$63</span>

Answer 2

仅 HTML：使用

1. 两个span标签和2.样式上不同的字体大小

   <span style="font-size: 25px;">Rs</span> <span style="font-size: 50px;">2000/-</span>

Answer 3

检查这个http://jsfiddle.net/RPf4N/2/

html

<div id="mydiv">$<a>63</a></div>

你的CSS

#mydiv
{
    font-size:20px;
}
#mydiv a
{
    font-size:100px;
}

Answer 4

+1 给@Abhishek 答案。 我能够利用 < a > 标签将多种字体大小添加到单个 HighCharts 标签内联中，例如： ...“标签”：“abc
def”，