欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

你如何把兩個圖片放在一起，文字都放在中間？我知道你可以改變元素大小，使元素在中心

CSS
謝彥文1年前8瀏覽0評論

我試著把兩張圖片和它們的描述放在一起。這是我的代碼。

我打算把兩張圖片和它們的文字放在一起。我試圖分割div元素，但問題是一段文本在另一段之下，而不是緊挨著另一段。文本需要在圖像的右邊，第二個圖像需要在第一個文本的右邊。

#sheets {
  width: 50%;
  margin: auto;
}

#docs {
  width: 25%;
  margin: auto;
}

img {
  float: left;
  margin-right: 10px;
}

<div id="sheets">
  <a href="Spreadsheet.html"><img src="https://upload.wikimedia.org/wikipedia/commons/d/dd/Flag_of_the_Roman_Empire.png" height="200" width="350"></a>
  <h1>Ancient Rome</h1>
  <p>Ancient Rome was a great civilization, that along with Ancient Greece, contributed to many things in the modern world, like architecture, numbers, letters, and government.</p>
</div><br><br><br><br><br><br><br><br>
<div id="docs">
  <img src="https://upload.wikimedia.org/wikipedia/commons/e/ef/Pantheon_Rom_1_cropped.jpg" height="125" width="125">
  <p>One famous building of Ancient Rome. It's in good condition because the building has been in active use since the 7th century. The Pantheon has a dome.</p>
</div>
<div id="docs">
  <img src="https://upload.wikimedia.org/wikipedia/commons/d/d8/Colosseum_in_Rome-April_2007-1-_copie_2B.jpg" height="125" width="125">
  <p>Another famous building. Was used for entertainment of huge crowds. Most people did not die in gladiator matches. The Colosseum has a lot of arches.</p>
</div>

你的html中有一個錯誤。id就像& quot文檔& quot需要獨一無二。我把它改成了一個類。查看flexbox，并排排列您的圖像。

#sheets {
      width: 50%;
      margin: auto;
    }
    
    .docs {
      width: 25%;      
      
    }
    
    img {
      float: left;
      margin-right: 10px;
    }
    
    #container{
    display:flex;
    justify-Content:center;
    }

<html>

<body>
  <div id="sheets">
    <a href="Spreadsheet.html"><img src="https://upload.wikimedia.org/wikipedia/commons/d/dd/Flag_of_the_Roman_Empire.png" height="200" width="350"></a>
    <h1>Ancient Rome</h1>
    <p>Ancient Rome was a great civilization, that along with Ancient Greece, contributed to many things in the modern world, like architecture, numbers, letters, and government.</p>
  </div><br><br><br><br><br><br><br><br>
  <div id='container'>
  <div class="docs">
    <img src="https://upload.wikimedia.org/wikipedia/commons/e/ef/Pantheon_Rom_1_cropped.jpg" height="125" width="125">
    <p>One famous building of Ancient Rome. It's in good condition because the building has been in active use since the 7th century. The Pantheon has a dome.</p>
  </div>
  <div class = "docs">
    <img src="https://upload.wikimedia.org/wikipedia/commons/d/d8/Colosseum_in_Rome-April_2007-1-_copie_2B.jpg" height="125" width="125">
    <p>Another famous building. Was used for entertainment of huge crowds. Most people did not die in gladiator matches. The Colosseum has a lot of arches.</p>
  </div>
  </div>
  
</body>

</html>

上一篇c# json var
下一篇c# json sql