Google Chrome small font processing solution, that is, fonts below 12px_html5 tutorial skills

Google Chrome does not support small fonts below 12px, maybe because of user experience.
There are also some articles on the Internet saying that it can be used:

Copy the code

The code is as follows:

-webkit-text-size-adjust:none;

However, since chrome 27, support for this attribute has been removed.

Do we have any other ways to solve this problem?

Google Chrome supports CSS scaling, so we can make a fuss about this:

Copy code

The code is as follows:

-webkit-transform: scale(0.5);

Since the minimum support is 12px, then scale based on 12px,

At the same time, you can use -webkit-transform-origin-x: 0; to solve the displacement problem of margin-left after scaling:

Copy code

The code is as follows:

.test_tag{
font-size:12px;
-webkit-transform-origin-x: 0;
- webkit-transform: scale(0.5833333333333334);
}

The scale value is calculated as: 7 / 12 = 0.5833333333333334