Computer >> Máy Tính >  >> Lập trình >> CSS

Hiển thị các đường uốn cong với khoảng cách giữa chúng bằng nhau

Sử dụng align-conten t thuộc tính có giá trị khoảng trắng giữa để thêm khoảng cách giữa các dòng uốn cong.

Ví dụ

Bạn có thể thử chạy mã sau để triển khai khoảng trắng giữa giá trị

<!DOCTYPE html>
<html>
   <head>
      <style>
         .mycontainer {
            display: flex;
            height: 200px;
            background-color: #5D6D7E;
            align-content: space-between;
            flex-wrap: wrap;
         }
         .mycontainer > div {
            background-color: #EBF5FB;
            text-align: center;
            line-height: 60px;
            font-size: 30px;
            width: 100px;
            margin: 5px;
         }
      </style>
   </head>
   <body>
      <h1>Queue</h1>
      <div class = "mycontainer">
         <div>Q1</div>
         <div>Q2</div>
         <div>Q3</div>
         <div>Q4</div>
         <div>Q5</div>
         <div>Q6</div>
         <div>Q7</div>
         <div>Q8</div>
      </div>
   </body>
</html>