html - 如何在一个 div 中将所有内容对齐?

标签 html css

<分区>


想改进这个问题吗? 更新问题,使其只关注一个问题 editing this post .

关闭 3 年前

image

这是我在这里的第一篇文章,我正在尝试弄清楚如何做这样的事情 提前致谢

最佳答案

我会在 CSS 中使用 flexbox。一旦你学习了它,它将成为你在这类事情上经常使用的工具。当你使用 flexbox 时,有一个容器元素。我会用一个股利。看我的例子。

<!--HTML-->
<html>
  <div id="container">
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
  </div>

</html>

“box”的“类”的 div 是 no1 和 no2 段落。在 CSS 中使用:

/*CSS*/

#container {
  display: flex;
  flex-direction: row;

}

你只需要格式化盒子的类,它将格式化该类中的每个元素(在我上面的例子中是 4 个)

使用此备忘单,您很快就会成为这方面的专家。

https://www.steveaolsen.com/docs/FlexboxCheatsheet.pdf

另外,查看你要复制的页面源码,你都可以看到。

祝你好运

关于html - 如何在一个 div 中将所有内容对齐?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58050403/

上一篇:javascript - 如何更改进度条样式?

下一篇:html - 如何为 HTML 元素添加边距?

相关文章:

css - transform :translateX vs transition on left property. 哪个性能更好? CSS

html - 使用 CSS 显示下拉焦点的正确方法

javascript - 单击按钮后如何将具有多个类的数据属性值输入到 div?

Javascript 和 JQUERY : opening and closing divs using click function

php - 按编号选择foreach循环范围

html - 如何定位两个 float 的对象?

javascript - 将 chatango 添加到 Bootstrap 问题

javascript - 如何为跨度文本添加可变颜色

jquery - 用 slider 替换一张多页标题图片

CSS 子选择器 : can't select rows direct children of table, 不包括子表的子项