How To Change The Link Font

Table of contents:

How To Change The Link Font
How To Change The Link Font
Anonim

Changing the display parameters of links in html can be done using cascading css style sheets. They allow you to customize the display of the link font, its color before the user clicks on it and after the mouse clicks. You can also change the typeface of the font used and its size.

How to change the link font
How to change the link font

Instructions

Step 1

Classes and pseudo-classes are used to set link parameters in css. The pseudo-class a: link sets the style for a regular link, a: visited allows you to customize the display of an already used link. A: active handles the parameters of the tag when the cursor is clicked on the element, and a: hover sets the style of the link when you hover over it. You can also create any class for the element yourself, and in the parameters use standard operators to format the text.

Step 2

To disable the display of the underline of the link text in the browser, use the text-decoration: none parameter. You can specify this attribute both in a class and in a pseudo-class for an element. To change the color of the link, use the color parameter, for the size - the standard font-size attribute. If you want to include bold or italic type, use the font-weight parameter.

Step 3

Open your html file with whatever text editor you use to edit the page code. After that, go to a section of your document and set the css code for future links on the page using a handle. For example:

Changing links

a: link {text-decoration: none;

font-size: 14px;

font-weight: bold;

color: red; }

Step 4

This code removes the underline from a regular link, sets the text size to 14 pixels, applies a bold style and red color of the element. Now any link in the tag will be displayed like this.

Step 5

You can style for each specific link using css classes. Thus, if the code in the tag looks like:

a.link1 {font-size: 20px; color: black;}

Step 6

You can set the size of the link to 20 pixels and black by using the class in the body of the document as follows:

Link

From the example, you can see that the link was assigned the created step back css code class by specifying the class attribute of the link. This link will now be displayed in black and have a size of 20 pixels. To change this attribute, edit the css code of the page section.

Step 7

Changing the appearance of the link is complete, you can save the changes made in the file and run it for viewing in a browser.

Recommended: