twitter-bootstrap 如何在 HTML 的同一行中包含 2 种字体大小的文本？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22634874/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to have text of 2 font sizes in same line in HTML?
提问by
I am developing a front end HTML page using bootstrap and basic HTML code. I need to print price of a particular product say $63. I want this to be in same line but the size of $ needs to be smaller than the number. How do I achieve this?
我正在使用引导程序和基本 HTML 代码开发前端 HTML 页面。我需要打印特定产品的价格，比如 63 美元。我希望它在同一行，但 $ 的大小需要小于数字。我如何实现这一目标？
采纳答案by Fabrizio Calderan
Markup
标记
<span><b>$</b>63</span>
CSS
CSS
span { font-size: 3em;}
span b { font-size: 60%; }
You could also avoid to use a nested element to wrap the currency sign and use the ::first-letterpseudoclass to style it, but this requires a blockor inline-blockparent element, e.g.
你也可以避免使用嵌套元素来包装货币符号并使用::first-letter伪类来设置它的样式，但这需要一个block或inline-block父元素，例如
Markup
标记
<span></span>
CSS
CSS
span {
font-size: 3em;
display: inline-block; }
span::first-letter { font-size: 60%; }
Result:
结果：
回答by Abhishek
Check this http://jsfiddle.net/RPf4N/2/
检查这个http://jsfiddle.net/RPf4N/2/
html
html
<div id="mydiv">$<a>63</a></div>
ur css
你的CSS
#mydiv
{
font-size:20px;
}
#mydiv a
{
font-size:100px;
}
