Html 如何在同一个 <p> 中设置两种不同的字体大小

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18521152/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 12:49:07  来源:igfitidea点击:

How to set two different font sizes in the same <p>

htmlcssfont-sizeparagraph

提问by user182

I have a piece of HTML code that i'm stuck with. How can I set the first part of this text to a font-size of 20px and the text after the <br>tag to a font-size of 15px?

我有一段我坚持使用的 HTML 代码。如何将此文本的第一部分设置为 20px 的字体大小,并将<br>标签后面的文本设置为 15px 的字体大小?

Or if I'm doing it completely wrong, how would I do it without having them in different tags

或者,如果我完全做错了,如果不将它们放在不同的标签中,我该怎么做

<p id="losinfo"> Los Santos: a sprawling sun-soaked metropolis full of 
self-help gurus, starlets and fading celebrities, once the envy of the 
Western world, now struggling to stay afloat in an era of economic 
uncertainty and cheap reality TV <br><br> Our largest open world yet
 - by far - and spanning vastly diverse cultural and geographical areas, 
the entire world of Grand Theft Auto V is open from the very beginning 
of the game to explore. Visitors to the greater metropolis of Los Santos 
and the countryside of Blaine County will encounter faded celebrities, 
meth heads, party people, violent gangs, hikers, bikers and every other 
manner of colorful denizen. You'll be able to traverse everywhere from 
the tops of the mountains, through the streets of Los Santos and to the 
depths of the ocean floor</p>

回答by Daniel Morgan

<p id="losinfo">Los Santos: <span id='secondText'> a sprawling sun-soaked ...</span></p>

then style #losinfoand #secondTextdifferently in css.

然后在 css 中风格#losinfo#secondText不同。

回答by James

Use a div around the part you want 20pxand another div around the part you want 15pxis what I would do. Then set those divs with classes and set the font-sizein css.

在你想要的部分周围使用一个 div,在你想要的部分周围使用20px另一个 div15px是我会做的。然后使用类设置这些 div 并font-size在 css 中设置。

回答by Paramasivan

Try

尝试

CSS

CSS

p#losinfo {
font-size:20px;
}
p#losinfo span {
font-size:15px;
}

Html

html

<p id="losinfo"> Los Santos: a sprawling sun-soaked metropolis full of self-help gurus, starlets and fading celebrities, once the envy of the Western world, now struggling to stay afloat in an era of economic uncertainty and cheap reality TV <br><br> 
<span>Our largest open world yet - by far - and spanning vastly diverse cultural and geographical areas, the entire world of Grand Theft Auto V is open from the very beginning of the game to explore. Visitors to the greater metropolis of Los Santos and the countryside of Blaine County will encounter faded celebrities, meth heads, party people, violent gangs, hikers, bikers and every other manner of colorful denizen. You'll be able to traverse everywhere from the tops of the mountains, through the streets of Los Santos and to the depths of the ocean floor</span></p>

回答by Paolo Gibellini

Your question is a bit unclear.
Are you meaning something like this?

你的问题有点不清楚。
你的意思是这样的吗?

<p id="losinfo">
<span style="font-size:20px;">Los Santos</span>
<span style="font-size:15px;">: a sprawling sun-soaked metropolis [...]</span>
</p>

回答by sepuckett86

I came across this question because I was trying to figure out how to change font in the same line of text. Lo and behold, span also works for this. Here's without the ids, for simplification:

我遇到这个问题是因为我试图弄清楚如何在同一行文本中更改字体。瞧,跨度也适用于此。为简化起见,这里没有 ID:

To change font size

更改字体大小

<p>regular text <span style="font-size: 30pt;">new size text</span></p>

To change font

更改字体

<p>old font <span style="font-family: courier;">new font</span></p>