Home > Article > Web Front-end > How to display a link on the right in css
How to display a link on the right in css
- WBOYOriginal
- 2021-11-30 15:44:404535browse
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;}".
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>Output result:
(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!