How to display a link on the right in css-CSS Tutorial-php.cn

How to display a link on the right in css

WBOY

Release： 2021-11-30 15:44:40

Original

4481 people have browsed it

In CSS, you can use the float attribute to set a link to be displayed on the right. This attribute can define the direction in which the element floats. When its value is set to "right", the element will be displayed on the right. The syntax is "a{float:right;}".

How to display a link on the right in css

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

How to display a link on the right in css

We can set a link to display on the right through the float attribute.

The float attribute defines in which direction the element floats. Historically this property has always been applied to images, causing the text to wrap around the image, but in CSS, any element can be floated. A floated element creates a block-level box, regardless of what type of element it is.

If floating non-replaced elements, specify an explicit width; otherwise, they are made as narrow as possible.

Let’s take a look at it through an example:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <style>
    a{
      float:right;
    }
    </style>
</head>
<body>
<a href="https://www.php.cn/" target="_blank">这是一个a标签</a>
</body>
</html>

Copy after login

Output result:

How to display a link on the right in css

(Learning video sharing: css video tutorial )

The above is the detailed content of How to display a link on the right in css. For more information, please follow other related articles on the PHP Chinese website!