字体大小的问题 [英] font-size question

查看:71
本文介绍了字体大小的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有< ttinside:


;;; < p>段落包含< tt> tt元素< / tt>。< / p>


我想将TT的字体大小设置为相同

作为包含< p> ;.


这似乎不起作用:


;;; p {

;;; font-size:medium;

;;; }

;;;

;;; p tt {

;;; font-size:100%;

;;;当物品和等宽字体的默认大小

在浏览器中设置为不同的值时,



有没有办法实现目标而不诉诸

''px''?


TIA

T.

解决方案

Scripsit Takehiko Abe:


我有< pelement with< ttinside:



- -


我想将TT的字体大小设置为相同

作为包含< p>。



那将是

p tt {font-size:100%; }

或等同于规格,

p tt {font-size:1em; }


这似乎不起作用:


;;; p {

;;; font-size:medium;

;;; }



p元素的字体大小与所述

问题的目的无关,除非您使用像px这样的物理单位或mm,你不应该使用它们。$ / b

此外,这个使用medium作为字体大小值的特殊设置是

不值得推荐,因为它的效果取决于浏览器。即使在IE 7上,

也会得到不同的结果,具体取决于标准模式。 vs.quirks mode。


;;; p tt {

;;; font-size:100%;

;;; }



你说它不起作用是什么意思?请注意,等宽字体的视觉外观可能会给人一种增加字体大小的印象。对于大多数人来说,这可能听起来自相矛盾,因为大多数人都不知道字体大小是什么。真的意思是。


字母通常比等宽字体更大(更高),而不是相同尺寸的

比例字体。这可能是许多浏览器使用缩小字体大小的主要原因,因为这些元素通常以等宽字体呈现为元素,因此效果可能对应于

tt,code,samp,pre,textarea {font-size:90%}。你可以通过使用

tt,code,samp,pre,textarea {font-family:Times New Roman;来看看这个

是否是你的浏览器的情况。 }


同样,你可以测试是否

p tt {font-size:100%; }

生效,如果你添加规则

p,p tt {font-family:Times New Roman; }

(你可以使用pt {font-family:inherit;},但IE不支持

吧。)


当属性和等宽字体的默认大小

在浏览器中设置为不同的值时。



除非涉及一些糟糕的浏览器错误,否则当设置font-size时,这些默认大小应该没有效果。从理论上讲,浏览器设置_might_

在概念上用!important说明符映射到CSS规则,但我不认为

事情是这样的,如果它们是,那里对你来说,你无能为力。

作者 - !重要的是_meant_成为用户的最后手段并给他

最后一句话。 br />

-

Jukka K. Korpela(Yucca)
http://www.cs.tut.fi/~jkorpela/


;;; p tt {


;;; font-size:100%;

;;; }



你说它不起作用是什么意思?



我的意思是用不同的字体大小呈现的TT。

例如,在我的FireFox(2.0)中没有 - serif字体设置为

" Helvetica 14"和monospace到Courier 13。使用这些

默认值和上面的CSS样式,看起来P是用Helvetica 14和TT用Courier 13渲染的



字母通常比等宽字体更大(更高),而不是相同大小的

比例字体。这可能是许多浏览器使用缩小字体大小的主要原因,因为这些元素通常以等宽字体呈现为元素,因此效果可能对应于

tt,code,samp,pre,textarea {font-size:90%}。你可以通过使用

tt,code,samp,pre,textarea {font-family:Times New Roman;来看看这个

是否是你的浏览器的情况。 }



我用tt {font-family:sans-serif}进行了测试(我假设这个

提供与你的例子相同的测试)。 TT以

Helvetica 14呈现。 (我浏览器中的默认设置。)


(我严格使用HTML 4.01。)


谢谢,

T.




Takehiko Abe写道:


我有一个< ;< ttinside:


;;; < p>段落包含< tt> tt元素< / tt>。< / p>


我想将TT的字体大小设置为相同

作为包含< p> ;.


这似乎不起作用:


;;; p {

;;; font-size:medium;

;;; }

;;;

;;; p tt {

;;; font-size:100%;

;;; }



当然可以。


当属性和等宽字体的默认大小时

在浏览器中设置为不同的值。



不,他们不是:但他们给出了不同的_visual_效果,因为他们的

字形是建立在不同的原则上的。


有没有办法在不诉诸''px'的情况下实现目标?



这与您使用的内容无关:所有相对单位是

在应用之前计算为像素值。在这方面是

与你使用的无关:%,em,ex,pt或其他:屏幕上的实际样式将始终为px。

对于每个

的部分硬件和当前文本大小设置重新计算相对单位的重要性。


您可以轻松检查两种字体的字体大小是否为px:


< head>

< title> Untitled Document< / title>

< meta http-equiv =" Content-Type"

content =" text / html; charset = iso-8859-1">

< style type =" text / css">

p {

font-尺寸:2em;

}

p tt {

字体大小:1em;

}

< / style>

< script type =" text / javascript">

function init(){

var P = document.getElementsByTagName(''p'')[0];

var T = document.getElementsByTagName('tt'')[0];

if(document.defaultView){

alert(

document.defaultView.getComputedStyle(P,''first-letter'')。fontSize);

alert(

document.defaultView.getComputedStyle(T,''first-letter'')。fontSize);

}

}

window.onload = init;

< / script>

< / head>

< body>

< p>文字< tt>文字< / tt>< / p>

< / body>

< / html>


检查它们也很容易在同一基线上。所以

无论需要什么都完成了。如果你想要一个servis和monospace的_visual_平等

那么你必须通过制造一个更小或更大来打破他们的身体平等

:自然地调整效果

可能因硬件配置而异。


I have a <pelement with <ttinside:

;;; <p>A paragraph contains <tt>tt element</tt>.</p>

I would like to set the font-size of the TT to the same
as the containing <p>.

This does not seem to work:

;;; p {
;;; font-size: medium;
;;; }
;;;
;;; p tt {
;;; font-size: 100%;
;;; }

when default sizes for propertional and monospace fonts
are set to different values in a browser.

Is there a way to achieve the goal without resorting to
''px''?

TIA
T.

解决方案

Scripsit Takehiko Abe:

I have a <pelement with <ttinside:

- -

I would like to set the font-size of the TT to the same
as the containing <p>.

That would be
p tt { font-size: 100%; }
or, equivalently by the specifications,
p tt { font-size: 1em; }

This does not seem to work:

;;; p {
;;; font-size: medium;
;;; }

The font size of the p element is irrelevant for the purposes of the stated
problem, except if you used physical units like px or mm, and you shouldn''t
use them.

Besides, this particular setting, which uses medium as font-size value, is
not recommendable, since its effect depends on the browser. Even on IE 7,
you get different results depending on "standards mode" vs. "quirks mode".

;;; p tt {
;;; font-size: 100%;
;;; }

What do you mean by saying that it does not work? Note that the visual
appearance of a monospace font may give the impression of increased font
size. This may sound self-contradictory to most people, since most people do
not know what "font size" really means.

Letters are generally larger (taller) in a monospace font than in a
proportional font of the same size. This is probably the main reason why
many browsers use reduced font size for elements that are usually rendered
in a monospace font, so that the effect might correspond to something like
tt, code, samp, pre, textarea { font-size: 90% }. You can see whether this
is the case in your browser by using
tt, code, samp, pre, textarea { font-family: Times New Roman; }

Similarly, you can test test whether
p tt { font-size: 100%; }
takes effect, if you add the rule
p, p tt { font-family: Times New Roman; }
(You could use just p tt { font-family: inherit; }, but IE doesn''t support
it.)

when default sizes for propertional and monospace fonts
are set to different values in a browser.

Unless there''s some bad browser bug involved, those default sizes should
have no effect when font-size is set. In theory, browser settings _might_
conceptually map to CSS rules with !important specifier, but I don''t think
things are that way, and if they are, there''s nothing you can do about it as
an author - !important is _meant_ to be the user''s last resort and give him
the final word.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/


;;; p tt {

;;; font-size: 100%;
;;; }


What do you mean by saying that it does not work?

What I meant is that TT rendered with different font-size than P.
For instance, in my FireFox (2.0) sans-serif font is set to
"Helvetica 14" and monospace to "Courier 13". With these
defaults and the above CSS style, it appears that P is
rendered with Helvetica 14 and TT with Courier 13.

Letters are generally larger (taller) in a monospace font than in a
proportional font of the same size. This is probably the main reason why
many browsers use reduced font size for elements that are usually rendered
in a monospace font, so that the effect might correspond to something like
tt, code, samp, pre, textarea { font-size: 90% }. You can see whether this
is the case in your browser by using
tt, code, samp, pre, textarea { font-family: Times New Roman; }

I tested with "tt { font-family: sans-serif}" (I assumed that this
provides the same test as your example). TT is rendered with
"Helvetica 14" (the default in my browser.)

(I am using HTML 4.01 strict.)

Thanks,
T.



Takehiko Abe wrote:

I have a <pelement with <ttinside:

;;; <p>A paragraph contains <tt>tt element</tt>.</p>

I would like to set the font-size of the TT to the same
as the containing <p>.

This does not seem to work:

;;; p {
;;; font-size: medium;
;;; }
;;;
;;; p tt {
;;; font-size: 100%;
;;; }

Sure it does.

when default sizes for propertional and monospace fonts
are set to different values in a browser.

No they are not: but they give different _visual_ effect because their
glyphs are build on different principles.

Is there a way to achieve the goal without resorting to ''px''?

That is irrelevant what are you using: all relative units are
calculated into pixel values before being applied. In this aspect is
irrelevant what are you using: %, em, ex, pt, or anything else: the
actual style on the screen will be always in px.
What _is_ important that relative units are being recalculated for each
partucular hardware and current text size settings.

You can easily check that both fonts have the font-size in px:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<style type="text/css">
p {
font-size: 2em;
}
p tt {
font-size: 1em;
}
</style>
<script type="text/javascript">
function init() {
var P = document.getElementsByTagName(''p'')[0];
var T = document.getElementsByTagName(''tt'')[0];
if (document.defaultView) {
alert(
document.defaultView.getComputedStyle(P,''first-letter'').fontSize );
alert(
document.defaultView.getComputedStyle(T,''first-letter'').fontSize );
}
}
window.onload = init;
</script>
</head>
<body>
<p>Text<tt>Text</tt></p>
</body>
</html>

It is also easy to check that they are on the same baseline. So
whatever was required is accomplished. If you want a _visual_ equality
of serif and monospace then you have to break their physical equality
by making either one smaller or bigger: naturally the adjustment effect
may differ by hardware configurations.


这篇关于字体大小的问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆