center 相关问题

我有这个代码，我希望元素中的“0”居中。无论我对 .score 类做什么，“0”都只会停留在顶部中心并且不会从顶部移动...... 我有这段代码，我希望 <h2> 元素中的“0”居中。无论我对 .score 类做什么，“0”都只会停留在顶部中心并且不会从顶部移动。 body { margin: 0; background-color: #0369A1; text-align: center; } @font-face { font-family: CursedTimerUlil-Aznm; src: url(fonts/CursedTimerUlil-Aznm.ttf); } h3 { font-family: Verdana, Geneva, Tahoma, sans-serif; color: #EEE; font-size: 40px; font-weight: 700; margin: 21px; } .score { font-family: CursedTimerUlil-Aznm; border: 3px solid #BE123C; border-radius: 4px; background-color: #FB7185; width: 200px; font-weight: 400; font-size: 90px; margin: 28px 0; } .container { display: flex; justify-content: space-around; } .counters { display: flex; justify-content: space-between; margin: 0; } .counter-btn { font-family: CursedTimerUlil-Aznm; font-weight: 400; font-size: 18px; width: 48px; height: 48px; border: 2px solid #EEE; border-radius: 3px; color: #EEE; background-color: #0369A1; } <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="styles.css"> </head> <body> <div class="container"> <div class="card"> <h3>HOME</h3> <h2 class="score">0</h2> <div class="counters"> <button class="counter-btn">+1</button> <button class="counter-btn">+2</button> <button class="counter-btn">+3</button> </div> </div> <div class="card"> <h3>GUEST</h3> <h2 class="score">0</h2> <div class="counters"> <button class="counter-btn">+1</button> <button class="counter-btn">+2</button> <button class="counter-btn">+3</button> </div> </div> </div> </body> </html> 我有另一段代码，其中“0”保持完美居中，但我无法弄清楚第一个代码有什么问题以及这两段代码之间有什么区别。我的工作 HTML 代码： body { margin: 0; text-align: center; } .score { background: #0a0001; font-size: 90px; color: #F94F6D; width: 120px; margin: 20px; } .container { display: flex; justify-content: space-around; } button { background: none; } <html> <head> <link rel="stylesheet" href="index.css"> </head> <body> <div class="container"> <div class="column"> <h3>HOME</h3> <h2 class="score">0</h2> <div> <button>+1</button> <button>+2</button> <button>+3</button> </div> </div> <div class="column"> <h3>GUEST</h3> </div> </div> </body> </html> 与第二个片段相比，第一个片段应用了更多应用于 .score 的 CSS 属性，但下面的更改应该会得到您想要的结果。 “应该”.. .score { font-family: CursedTimerUlil-Aznm; border: 3px solid #BE123C; border-radius: 4px; background-color: #FB7185; width: 200px; font-weight: 400; font-size: 90px; margin: 28px 0; display: flex; /* Added this line */ justify-content: center; /* Added this line */ align-items: center; /* Added this line */ }

html css center centering

回答 1 投票 0

在图像周围添加边框后如何使图像在div中居中？

html 和 CSS 编码预览正如您所添加的图片所示，我将 DIV 居中于网页的中心，并将 DIV 内的图像和文本也居中于网页的中心。这个问题...

css image border center web-frontend

回答 1 投票 0

如何将字幕置于使用 RMarkdown 创建的 pdf 文件的特定部分的中心

我正在尝试将使用 RMarkdown 创建的 pdf 部分的副标题居中。我正在使用以下代码 --- 标题：“示例” 作者：“X” 日期：“2023-09-23” 出来...

pdf text header r-markdown center

回答 1 投票 0

如何在CSS中使滑块居中？

我在主题上安装了这个插件。这个主题有一个滑块，但我不喜欢它。所以我安装了这个。 http://wordpress.org/extend/plugins/content-slide/ 我尝试使用这个 #