Example code for CSS to achieve horizontal lines on both sides of the text
|
This article introduces the sample code of CSS to achieve the effect of horizontal lines on both sides of the text center, and shares it with you. The specific notes are as follows: Effect:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.title{
text-align: center;
position: relative;
height: 50px;
line-height: 50px;
width: 800px;
margin: 200px auto;
}
.title:after,.title:before{
content: "";
position: absolute;
top: 50%;
background: #7a7a7a;
height: 1px;
width: 35%;
}
.title:after{
left: 0;
}
.title:before{
right: 0;
}
</style>
</head>
<body>
<div class="title">CSS to achieve the effect of horizontal lines on both sides of the text center</div>
</body>
</html>The above is the full content of this article. I hope it will be helpful for everyone’s study. I also hope that everyone will support 123WORDPRESS.COM. |
<<: Steps to restore code from a Docker container image
>>: H tags should be used reasonably in web page production
Recommend
Teach you step by step to develop a brick-breaking game with vue3
Preface I wrote a few examples using vue3, and I ...
A brief discussion on innodb's index page structure, insert buffer, and adaptive hash index
Physical Structure of an InnoDB Index All InnoDB ...
Detailed tutorial on installing ElasticSearch 6.x in docker
First, pull the image (or just create a container...
Summary of methods to clear cache in Linux system
1) Introduction to cache mechanism In the Linux s...
Solution to the problem that the mysql8.0.11 client cannot log in
This article shares with you the solution to the ...
MySQL select, insert, update batch operation statement code examples
In projects, batch operation statements are often...
Summary of Spring Boot Docker packaging tools
Table of contents Spring Boot Docker spring-boot-...
MySQL 8.0.12 decompression version installation tutorial
This article shares the installation tutorial of ...
Implementation of Docker deployment of MySQL cluster
Disadvantages of single-node database Large-scale...
How to implement https with nginx and openssl
If the server data is not encrypted and authentic...
Summary of the switching problem and solution of installing multiple JDK versions in win10 64-bit system
Since myeclipse2017 and idea2017 are installed on...
How to use mysql to complete the data generation in excel
Excel is the most commonly used tool for data ana...
Web front-end development experience summary
XML files should be encoded in utf-8 as much as p...
Summary of considerations for writing web front-end code
1. It is best to add a sentence like this before t...
mysql solves the problem of finding records where two or more fields are NULL
Core code /*-------------------------------- Find...