Home Web Front-end HTML Tutorial Setting the font size of HTML web pages

Setting the font size of HTML web pages

Nov 22, 2017 pm 03:05 PM
html set up

There are many ways to set the font size of HTML web pages. Today I will mainly introduce two methods to you. One is to set the font size in HTML with CSS, and the other is to set the style in the html tag . PropertySets the font size.

Next, we will introduce the font size setting tutorial through html case.

html font tag sets font size

Before css, html Chinese text sets the font. Usually, the font tag is used directly to set the font size style for the text.

1. HTML text size font syntax structure

<font size="2">My font size is 2</font>

Explanation: Use font directly Set the size in the label to set the font size. Please note that it cannot contain units. Generally, 2 is equivalent to 12px, 3 is equivalent to 14px, and so on.

2, html font font size case html source code

&lt;!DOCTYPE html&gt; 
&lt;html&gt; 
&lt;head&gt; 
&lt;meta charset=&quot;utf-8&quot; /&gt; 
&lt;title&gt;在线演示&lt;/title&gt; 
&lt;/head&gt; 
&lt;body&gt; 
&lt;font size=&quot;2&quot;&gt;在线演示测试&lt;font size=&quot;4&quot;&gt;文字&lt;/font&gt;, 
欢迎访问网站!&lt;/font&gt; 
&lt;/body&gt; 
&lt;/html&gt;
Copy after login

css fontSize words:

Font-size

Syntax structure

div{font-size:20px}
Copy after login

Set the font size of the text in the div to 20px

It should be noted that css using font-size to set the font size value needs to have units, such as px (pixels), EM (relative length size unit), generally uses px pixels as the unit (Understand the html unit).

Set the text size in a DIV box to 14px through css, and set the font size of several words in the div box to 20px.

The complete HTML CSS font size example code is as follows:

&lt;!DOCTYPE html&gt; 
&lt;html&gt; 
&lt;head&gt; 
&lt;meta charset=&quot;utf-8&quot; /&gt; 
&lt;title&gt;在线演示&lt;/title&gt; 
&lt;style&gt; 
.box{ font-size:14px} 
.box .f20{ font-size:20px} 
&lt;/style&gt; 
&lt;/head&gt; 
&lt;body&gt; 
&lt;div class=&quot;box&quot;&gt; 
在线演示测试&lt;span class=&quot;f20&quot;&gt;文字&lt;/span&gt;,欢迎访问网站! 
&lt;/div&gt; 
&lt;/body&gt; 
&lt;/html&gt;
Copy after login

There are so many ways to set web fonts in HTML. I believe everyone must have understood it. Friends in need can save it. Please also Please continue to pay attention to other updates on this site.

Related reading:

How to use DIV and CSS to make a navigation bar


in HTML How to use checkbo


What are the functions of html comments

The above is the detailed content of Setting the font size of HTML web pages. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot Article

Hot Article

Hot Article Tags

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Nested Table in HTML Nested Table in HTML Sep 04, 2024 pm 04:49 PM

Nested Table in HTML

HTML margin-left HTML margin-left Sep 04, 2024 pm 04:48 PM

HTML margin-left

Table Border in HTML Table Border in HTML Sep 04, 2024 pm 04:49 PM

Table Border in HTML

HTML Table Layout HTML Table Layout Sep 04, 2024 pm 04:54 PM

HTML Table Layout

Moving Text in HTML Moving Text in HTML Sep 04, 2024 pm 04:45 PM

Moving Text in HTML

HTML Ordered List HTML Ordered List Sep 04, 2024 pm 04:43 PM

HTML Ordered List

HTML onclick Button HTML onclick Button Sep 04, 2024 pm 04:49 PM

HTML onclick Button

How do you parse and process HTML/XML in PHP? How do you parse and process HTML/XML in PHP? Feb 07, 2025 am 11:57 AM

How do you parse and process HTML/XML in PHP?

See all articles