Design of CSS Web page about font size

When designing a network application, you must decide how to edit the font. There are a number of options when using CSS , and each developer has its own preferences. This article mainly discusses the font size and the operation within the network application. There is nothing more important in developing a Web application than it looks. So, I wouldn't be surprised to find that designers are very concerned about fonts and font sizes!

Font size

The CSS2 specification defines fonts based on length--Horizontal and vertical dimensions. This length is a numeric value and may be preceded with an optional plus (+) or minus (-) marker. In addition, the value may have an optional unit identifier after it.

In addition, the CSS2 specification defines two unit types: absolute units and relative units. The absolute value specifies the unit, and the relative unit specifies a value that is proportional to another value. The following list lists the relative unit identifiers:

EM: The height of the element font. It evaluates to the same value as the font size property of the element that uses the font. When it appears in the font Size property value itself, an exception occurs when it refers to the font size of the parent element.

Ex (x-height): The CSS2 specification describes it as the height of the lowercase letter x.

PX (pixels): It is related to the resolution of the background or screen. Depending on the display resolution output of different pixels, due to user preferences, the display resolution may vary greatly.

The following are valid absolute unit identifiers:

In (inches)

CM (cm)

MM (mm)

PT (dot, 1 o ' =1/72 inches)

PC (12-point movable Type, 1pc=12 point)

Another way to measure absolute size is to apply the following keywords: minimum, small, small, medium, large, large, and minimum, using the proportional factor that measures a value. As the base value, smaller to subtract a factor, to increase a factor, and so on. The scale factor defined by the CSS2 specification is 1.2, and this value may vary depending on the browser.

You can also apply a percentage value to format text. The percent value is an optional marker, which is followed by a percent sign (%). The percent value is always proportional to another value. In the case of a font, it is proportional to the basic font size of the Web page.

As you can see, there are many ways to do this seemingly simple task of rendering text. The following HTML-formatted text (in a paragraph element) applies various unit identifiers. All of these values are equal and are assumed to be displayed in 72dpi.

You can add a pixel value to the list, but its value depends on the environment. For example, my laptop with 1280x1024 resolution will display text that is consistent with the 50 pixel values used in the table above.

Read the CSS2 specification mentioned earlier to get more knowledge of font size. Now I'll talk about deciding which method to use in a Web application.

Choose which method

There are many fonts-related options in CSS, but which one is best for your network applications? There are many flaws in absolute size, especially in terms of consistency, flexibility, and accessibility. As opposed to absolute font size, any visually impaired user can use relative font size to enlarge the text on the page, making it easier to read. As a result, developers often use relative sizes.

Let's look at the relative size in detail:

Pixels are the most common size values. Most browsers support it, but that's not always the case. Browsers often treat pixels as screen pixels rather than as CSS pixels. One disadvantage of pixels is that it ignores or negates the user's preferences and cannot be resized in IE.

Many developers prefer to use points to measure font size, but the point is primarily for desktop printing systems that are not easy to migrate to the network. When text is rendered, the operating system or browser uses pixels by default.

The most common method is to use EM or percent size. EM can be adjusted in all browsers that support sizing. EM also relates to the default size of the user preference. The results of applying EM in IE are unpredictable. In IE, it is best to use percentages to set the text size.

The following example uses the EM and percent values to format the text. The base text is set in percent values and then adjusted with EM.

body{font:sansserif,arial;font-size:110%}

It's all about the look.

Existing standards provide a number of ways to format and render text in network applications. Developers can easily decompose text into relative and absolute identifiers. The key is to stay consistent and thoroughly detect the solution.