First of all, I want to digress a little from the topic and talk about my code examples, for example, in the previous chapter I did not depict the full page code anywhere, but only showed it like this:

• HTML
• CSS
  • introduction
  • types of documents
  • style types
• PHP

Now let’s return to our chapter; to perform all these functions listed in the title, a container tag is used

Now let's get back to our topic.

In order to change the size, font or color of the text of a separate section in HTML, there is a container tag separate piece of text

Let's start in order and learn how to change the text color of a separate section, for this purpose in a tag FONT need to place attribute COLOR like this:

color="red"> separate piece of text Attribute values color the same as for the bgcolor text attributes of the body tag, i.e. we can specify them with words in English (Black, Green, Silver, Lime, Gray, Olive, White, Yellow, Maroon, Navy, Red, Blue, Purple, Teal , Fuchsia, Aqua) or color numbers in RGB (#000000- #FFFFFF)

face="Tahoma"> separate piece of text Fonts serve to make the text have a more extraordinary appearance, but there is one problem, the fonts that you have (you can view them in C:WINDOWSFonts) may not be available to your visitors, the second problem with fonts is that some fonts can only be used in Cyrillic (Russian letters) or vice versa only with the Latin alphabet (English letters), there is, of course, a third type that is suitable for both the Latin and Cyrillic alphabet. In the lower list I will show which fonts are standard and are available on all computers and also fit any letters:

• Arial
• Cosmic Sans
• Courier
• Garamond
• Helvetica
• Verdana
• Tahoma
• Times
• Times New Roman

Now let's move on to sizes, you can change the text size in HTML using two tags font and/or BASEFONT.
Let's start with BASEFONT, this tag is used to change the base color, font and size of the text, for example:
....text....
This tag is not a container, i.e. has no back tag. The color and font of the text are set as in the tag FONT, but to change the text size the attribute is used SIZE with a value from 1 to 7. This tag can be used several times in the text: size="4">....text....
size="6">....text....
size="3">....text....
By default, text size = "3", this size can not be specified. In the first example we increased the text by one, in the second line we increased it to “6”, and in the third we returned it to the default text again.
Now I want to disappoint you, this tag was introduced in version HTML-4.01, and accordingly, only Internet Explorer is supported in the browser, other browsers simply ignore it, So it’s better not to use this tag at all!!!
And use only the tag FONT with SIZE attribute it is supported by almost all browsers. SIZE attribute, also takes values ​​from 1 to 7, but these sizes can also be specified from “-2” to “+4”
text
text
text
text
text
text
text
The FONT tag, like BASEFONT, can contain several attributes:
size="5" color="red" fase="Tahoma, Times, Verdana">.... text....

Greetings to all readers of this article and subscribers of my blog! I want to devote today’s publication to a topic without knowledge of which your Internet resources will not be readable and attractive: “How to set a font in HTML.” The topic itself is easy and I am sure you will master it quickly.

However, we should not forget that web languages ​​are rich in all sorts of font design tools that, ideally, you need to know. After reading the article, you will confidently master text formatting, learn how to set different styles, types of font styles and decorations, as well as change the size and color of both sentences and individual letters. Let's get started!

Fonts are different

The bulk of signs, press and literature, websites and other services use standard fonts. Although they are comfortable, they have long become boring and do not catch the eye. That is why many designers slightly change the type of design or create new styles altogether. The most famous and influential fonts are:

• Helvetica;
• Futura;
• Garamond;
• Bodoni;
• Bembo;
• Rockwell;
• Times New Roman.

Their main differences lie in their relationship to certain families. There are serif (serif), sans serif, decorative, italic, and monospace families.

I also want to emphasize that there are 5 font sizes.

Let's start with the html language and its “creative abilities”

Name first header

P subtitle with a red letter!

Here is located first paragraph current example. For clarity these words will be written in italics.

Let me remind you that the attribute align = "center" sets the text to be displayed in the center.

And now the time has come for css to show off its skills

Despite the whole set of various tags provided by html, css is a more convenient and flexible tool for designing the appearance of fonts.

The main properties used to format content are: font and its components: text-decoration.

Let's look at it first font. This is a universal parameter, thanks to which you can set several values ​​at the same time. In addition, each parameter operates with its own keywords.

Property text-decoration helps to decorate text with additional elements such as underlining ( underline), strikethrough ( line-through), overline ( overline), and also inherit the parameters of the parent ( inherit) or cancel all registration ( none).

Now it's time for the second example. I took the previous code and styled it using css. So, the title was decorated with a shadow (using the property text-shadow) and with an outline around ( border-color). At the same time, I made one word larger. I also wanted to use the parameter opacity to set the transparency of the subtitle.

Name first header

Translucent subtitle!

Here is located first paragraph current example. For clarity these words will be written in italics.

Description

Tag increases the font size by one compared to normal text. In HTML, font size is measured in arbitrary units from 1 to 7, the average default text size is 3. Thus, adding a tag increases the text by one conventional unit. Nested tags are allowed , and the font size will be larger with each level.

In addition, displays the text in the browser with all spaces between words ( by default, browsers treat multiple spaces following each other as one).

The remaining HTML tags that display text in a monospaced font are logical text formatting tags.  Their other purpose is that they provide various types of information for search engines and other programs about the text contained in them:
Tag - displays text that is program code;

Tag - denotes the text that is typed on the keyboard or for the names of keys;
Tag - designed to display text that is the result produced by a program or script.

Program code: FOR i=1 TO 20 


Key names: Alt+F1 


Script result: Hello PHP! 


All spaces between words: 
One Two Three - Try it yourself!
 



Program code: FOR i=1 TO 20
Key names: Alt+F1
Script result: Hello, PHP!
All spaces between words:
One Two Three - Try it yourself!
Quotes in HTML.  Underlining and striking out text
Tag is intended to underline text, and the tag to cross it out.  These are tags for the physical formatting of text, and, apart from visual design, they do not carry any semantic load.

In what cases you will use these tags is up to you!

 Stressed And crossed out text - That's it!


Stressed and crossed out text - That's it!
Quote formatting
Perhaps, during the process of creating a site, you will need to insert a quote onto the page.
A quotation is a verbatim excerpt of text from a work.  It is desirable that the quoted text be identified by the reader as inserted.  To do this, the quote must be highlighted/formatted accordingly.
In HTML there is a special tag for this purpose - 
.  The text enclosed in this tag is formatted as follows: there are spaces above and below the main text, and indents to the left and right ( approximately 40 pixels).


As G. Lamene said: 
Science serves only to give us an idea of ​​the extent of our ignorance.



As G. Lamene said:
Science serves only to give us an idea of ​​the extent of our ignorance.
Multiple boolean tags
We have not touched on 3 more tags that belong to the logical formatting group: these are tags 
, And 
.
Tags And similar.  The first one is intended to indicate an abbreviation, the second one is an acronym.
An acronym is the same as an abbreviation, only it is pronounced as a single word, and not letter by letter.
Both abbreviations, when viewed in a browser, are underlined with a dotted line, and it is advisable to add a tooltip to both - a decoding of the abbreviation ( using the title attribute).
Tag used to enclose text in quotation marks.  This tag can be used when formatting quotes or when using words and expressions that have a figurative meaning.

 
 HTML- this is an abbreviation - pronounced letter by letter.


 "Research Institute"> research institute is an acronym.  The acronym is used as an independent word.
 
Twins look alike The same
. 


HTML is an acronym - pronounced letter by letter.
 
Research Institute is an acronym.  The acronym is used as an independent word.
 
Twins are like two peas in a pod.