HTML의 글꼴 태그

WBOY원래의: 2024-09-04 16:27:51385검색

HTML의 글꼴 태그는 웹페이지나 HTML 문서를 더욱 매력적으로 만드는 데 사용되는 가장 중요한 속성 중 하나입니다. 포함된 텍스트의 크기, 색상, 스타일을 변경하는 속성이 있습니다. 글꼴 태그를 사용하면 웹 페이지의 크기, 색상, 글꼴을 동일한 텍스트 형식으로 만들 수 있습니다. 이 태그는 주로 크기, 얼굴 또는 유형, 색상과 같은 세 가지 주요 속성에 대해 작동합니다. 글꼴 태그는 HTML 문서의 블록 텍스트의 일부 기능을 변경하기 위해 HTML의 인라인 요소로 작동합니다. 안에 포함된 텍스트입니다. 태그는 포함된 텍스트의 스타일을 정의하는 데 사용됩니다.

구문:

<font size =" " face =" " color=" ">

위의 구문 상태에서 글꼴 크기는 구문에 대한 속성으로 텍스트의 특정 크기를 설정하는 데 사용됩니다. 이 크기는 1부터 7까지의 숫자로 정의할 수 있습니다. 여기서 1은 가장 작은 텍스트이고 7은 가장 큰 텍스트 크기입니다. 글꼴 태그의 얼굴 속성은 HTML 문서의 글꼴 유형을 정의하는 데 사용되는 반면, 색상 속성은 포함된 텍스트의 특정 색상을 정의하는 데 사용됩니다.
HTML <글꼴> 꼬리표. ..를 사용하여 정의합니다. HTML에 태그를 추가하세요.

<body>
<p> <font size="2" color="blue" face="Calibri"> </font>
</p>
</body>

이 태그는 글로벌 속성과 이벤트 속성도 지원합니다. 또한 아래에 나열된 몇 가지 다른 속성도 지원합니다.

Attribute Name	Detail Description
Size	This attribute is used to define a specific size for text in between 1 to 7.
Face or type	This attribute is used to define the font type for the included text.
Color	This attribute is used to show enclosed text in a different color.
Weight	This attribute defines the boldness of the text of the font tag.

속성 이름

상세 설명

크기 이 속성은 1에서 7 사이의 특정 텍스트 크기를 정의하는 데 사용됩니다. 얼굴 또는 문자 이 속성은 포함된 텍스트의 글꼴 유형을 정의하는 데 사용됩니다. 색상 이 속성은 둘러싸인 텍스트를 다른 색상으로 표시하는 데 사용됩니다. 무게 이 속성은 글꼴 태그 텍스트의 굵기를 정의합니다. HTML의 글꼴 태그 예

글꼴 태그는 HTML 코드에서 두 가지 방법으로 사용할 수 있습니다. 첫 번째는 HTML을 통해 글꼴 태그와 해당 속성 값을 포함하는 것이고, 두 번째는 속성 값을 CSS 코드로 정의하는 것입니다. 둘 다 동일한 출력을 생성합니다. 속성 값 정의의 유일한 차이점입니다.

예시 #1

속성 값으로 글꼴 태그 정의:

<!DOCTYPE html>
<html>
<head>
<title>Font Tag in HTML</title>
</head>
<body>
<h2>Example of  Font Tag in HTML </h2>
<p>General  text  without any Font tag attribute value</p>
<p>
<font color="orange">Text having normal font size and font face . Only changing
font   color  </font>
</p>
<p>
<font  face="cursive">Text having different font face.</font>
</p>
<p>
<font size="3">Text with Increased font size having default font type. </font>
</p>
</body>
</html>

코드:

출력: HTML의 글꼴 태그

예시 #2

CSS를 통해 정의된 속성 값으로 글꼴 태그를 정의합니다.

<!DOCTYPE html>
<html>
<head>
<title>Font Tag in HTML</title>
</head>
<body>
<h2>Example of Font Tag in HTML using CSS </h2>
<p>Someone’s sitting in the shade today because someone plated a tree a long time ago. </p>
<p style="color : lightgreen;"> Someone’s sitting in the shade today because someone plated a tree a long time ago.
</p>
<p style="font-family : Book Antiqua; color: blue; " > Someone’s sitting in the shade today because someone plated a tree a long time ago.
</p>
<p style="font size:3px;"> Someone’s sitting in the shade today because
someone plated a tree a long time ago.
</p>
</body>
</html>

코드:

출력: HTML의 글꼴 태그

예시 #3

이 예에서는 속성 값이 size인 Font 태그를 사용하고 있으며, 이는 아래와 같이 가장 낮은 크기에서 가장 높은 크기까지 텍스트를 정의합니다.

<!DOCTYPE html>
<html>
<head>
<title>HTML font tag</title>
</head>
<body>
<font size = "1">People may doubt what you say, but they will believe what you do.</font><br /> <br/>
<font size = "2">People may doubt what you say, but they will believe what you do.</font><br /> <br/>
<font size = "3">People may doubt what you say, but they will believe what you do.</font><br /> <br/>
<font size = "4">People may doubt what you say, but they will believe what you do.</font><br /> <br/>
<font size = "5">People may doubt what you say, but they will believe what you do.</font><br /> <br/>
<font size = "6">People may doubt what you say, but they will believe what you do.</font><br/><br/>
<font size = "7">People may doubt what you say, but they will believe what you do.</font>
</body>
</html>

HTML 코드:

출력: HTML의 글꼴 태그

예시 #4

<!DOCTYPE html>
<html>
<head>
<title>HTML tag with Font Type attribute</title>
</head>
<body>
<font face = "Comic sans MS"> Correct one fault at a time. Concentrate on the one fault you want to overcome.</font><br/>
<font face = "Bernard MT Condensed" color="Red" >Correct one fault at a time. Concentrate on the one fault you want to overcome. </font><br/>
<font face = "Algerian">Correct one fault at a time. Concentrate on the one fault you want to overcome. </font><br/>
<font face = "Book Antiqua" size="5">Correct one fault at a time. Concentrate on the one fault you want to overcome. </font><br/>
<font face = "Aharoni"> Correct one fault at a time. Concentrate on the one fault you want to overcome.</font><br/>
<font face = "AR BERKLEY" >Correct one fault at a time. Concentrate on the one fault you want to overcome. </font><br/>
</body>
</html>

HTML 코드:

출력: HTML의 글꼴 태그

예시 #5

<!DOCTYPE html>
<html>
<head>
<title>HTML Font tag-Color </title>
</head>
<body>
<font color = "#cc0066"><b>It is terrible thing to see and have no vision</b></font><br>
<font color = "#66ff33"><b>Today's preparation </b></font> <br>
<font color = "#0000cc"><strong>Success depends on your backbone not your wishbone.</strong></font><br />
<font color = "#cc3300"><b>Patience makes lighter what sorrow may not heal</b></font>  <br>
<font color = "#666600"><b>Hold fast to dreams, for if dreams die, life is broken winged bird that cannot fly </b></font> <br>
</body>
</html>

HTML 코드:

출력: HTML의 글꼴 태그

결론

위의 모든 정보를 통해 우리는 크기, 얼굴 유형, 색상이 글꼴 스타일의 핵심 속성이라는 것을 알게 되었습니다.

위 내용은 HTML의 글꼴 태그의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

css html define for format include using Attribute Event number this display

성명：

이전 기사：HTML의 캔버스 태그다음 기사：HTML의 캔버스 태그