Home > Web Front-end > CSS Tutorial > How to make font larger with css

How to make font larger with css

王林
Release: 2020-11-30 16:14:54
Original
3107 people have browsed it

How to make the font larger in css: You can use the font-size attribute to set the font size, such as [font-size:12px]. It should be noted that the font-size attribute sets the height of the character box in the font.

How to make font larger with css

The operating environment of this tutorial: windows7 system, css1 version. This method is suitable for all brands of computers.

Related recommendations: CSS tutorial

css makes the font larger

##font The -size attribute sets the size of the font.

This attribute sets the font size of the element. Note that this actually sets the height of the character boxes in the font; the actual character glyph may be taller or shorter than these boxes (usually shorter).

The font corresponding to each keyword must be taller than the font corresponding to the smallest keyword, and smaller than the font corresponding to the next largest keyword.

Possible values:

xx-small
x-small
small
medium
large
x-large
xx-large    把字体的尺寸设置为不同的尺寸,从 xx-small 到 xx-large。默认值:medium。    
smaller    把 font-size 设置为比父元素更小的尺寸。    
larger    把 font-size 设置为比父元素更大的尺寸。    
length    把 font-size 设置为一个固定的值。    
%    把 font-size 设置为基于父元素的一个百分比值。    
inherit    规定应该从父元素继承字体尺寸。
Copy after login

Example:


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>div的字体大小 CSS5</title>
<style>
div{ font-size:12px}
.xiao{ font-size:16px}
#da{ font-size:20px}
</style>
</head>
<body>
<div>默认设置12px</div>
<div class="xiao">字体大小为16px</div>
<div id="da">字体大小为20px</div>
<div style=" font-size:24px">我字体大小为24px</div>
<div>默认设置12px</div>
</body>
</html>
Copy after login

For more programming-related knowledge, please visit:

Programming Learning! !

The above is the detailed content of How to make font larger with css. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template