如何讓標題在媒體尺寸中居中？

Question

我想放置一個以常規尺寸居中的媒體尺寸，當我將其最大寬度更改為 480 時，標題位於左側。

但它黏在左邊。如何更改程式碼，使標題在媒體大小時位於中間？

caption {
   font-family: "Rock Salt", cursive;
   padding: 20px;
   font-style: italic;
   caption-side: Top;
   color: #666;
   text-align: center;
   letter-spacing: 1px;
 }




@media only screen and (max-width: 480px) {
  caption {
    caption-side: Top;
    text-align: center;
    letter-spacing: 1px;
  }

<section id="right"> 
        <table> 
           <caption>Books everyone will enjoy!</caption> 
           <thead> 
              <th colspan="4">Recommended childrens books!</th> 
              <th colspan="2" style="display: none">Recommended childrens books!</th> 
              <tr> 
                 <th colspan="1">Front of the book</th> 
                 <th colspan="1">Title of the book</th> 
                 <th colspan="1">Authors</th> 
                 <th colspan="1">Book Summary</th> 
             </tr> 
           </thead>

Answer 1

您需要將區塊元素置中：

@media only screen and (max-width: 480px) {
   caption {
      caption-side: Top;
      text-align: center;
      letter-spacing: 1px;
      margin:0 auto;
}