Using percent for font size?

2018-07-01 10:01:04

I've read a fair bit about resizing fonts recently, most of it deriding using px as an unforgivable crime (ok, maybe not that bad, you get the idea) because it doesn't resize properly in older browsers.

I really want to have a standard that I use myself, in the past that has been px, simply because it's simple, easy to understand and fairly easy to achieve the exact font sizes that are specified in designs - but I'm now doubting using px.

I used em on a project recently because it needed text-resizing functionality which I made using jQuery. But I found it quite frustrating because of the way that em amplifies if you have two elements inside of each other both with an em size specified (hope that makes sense)

So I was wondering about using % for font resizing, I've seen a couple of big websites use this technique (namely, Yahoo) and from what I understand it seems to have all of the advantages of em without the incredibly annoying amplification thing.

So in short, I'm just wondering if there are any issues with using % for font-sizing in CSS? Would it be better than using PX in terms of font-resizing? And are there any noticeable draw backs?

Apologies if the blurb before the question is a little much :/ I'm still kind of getting used to the whole QA thing

In CSS3, use rem (root em ). Sizing will not be affected by em size of the parent element.

try using this

body {
  margin: 0px;
  padding: 0px;
  font-size: 62.5%;
}

body>#wrapper {
  font-size:1em;
}

so, when you say something like 1em inside the "wrapper" you'll have a size very similar to 10px. here's a example table:

3em == 30px
.5em == 5px
8.5em == 85px

This will help you in the transition

Pd: of course, you need a wrapper tag after the body

The standard in web design as far as I have experienced it is to use a percent to set the font size in the body, then to use ems to change the font sizing after that. You could use percents outside the body tag with no adverse side effects, but I think many developers find ems easier to work with (anyone is free to check me on this).

The danger comes if you use ems to set the body font size; older browsers choke and incorrectly display the text, especially when zoomed.

链接地址: http://www.djcxy.com/p/87616.html

上一篇: CSS规则“明确：都是”做什么？