Html 如何将行和列放置在节的中心_Html_Css_Rows

Html 如何将行和列放置在节的中心

html css

Html 如何将行和列放置在节的中心,html,css,rows,Html,Css,Rows,我在学习HTML，我在做这个项目，基本上我试图在一个部分中显示8张图片，每一行4张。为了解决这个问题，我研究了如何在不使用该项目不允许使用的表的情况下生成行和列。我遇到了这样一个问题： * { 框大小：边框框； } /*创建四个相邻浮动的相等列*/ .栏目{ 浮动：左；宽度：25%；填充：10px；高度：300px；/*应移除。仅用于演示*/ } /*清除列后的浮动*/ .罗：之后{ 内容：；显示：表格；明确：两者皆有； } 四个相等的列第1栏一些文字第2栏一些文字第3栏

我在学习HTML，我在做这个项目，基本上我试图在一个部分中显示8张图片，每一行4张。为了解决这个问题，我研究了如何在不使用该项目不允许使用的表的情况下生成行和列。我遇到了这样一个问题：

* { 框大小：边框框； } /*创建四个相邻浮动的相等列*/ .栏目{ 浮动：左；宽度：25%；填充：10px；高度：300px；/*应移除。仅用于演示*/ } /*清除列后的浮动*/ .罗：之后{ 内容：；显示：表格；明确：两者皆有； } 四个相等的列第1栏一些文字

第2栏一些文字

第3栏一些文字

第4栏一些文字

标记为/*的所有行标记为/*的所有行由于您有两个部分，您可以简单地将它们包装成一个部分，并将其命名为main类，然后在其上应用flex box集中

这里有一个例子 whitetitle先生{ 颜色：白色； } 梅因先生{ 背景色：4AB19A；宽度：100%；显示器：flex；证明内容：中心；对齐项目：居中； } 格林先生{ 文本对齐：居中；背景色：4AB19A； } .厨房1{ 对齐项目：居中；证明内容：中心；保证金：自动； } .gallery1 img{ 边框：1px固体白烟；边界半径：90px；利润率：15px；高度：150像素；宽度：150px； } .栏目{ 对齐项目：居中；证明内容：中心；浮动：左；显示器：flex；宽度：20%；填充：10px；保证金：自动； } .罗：之后{ 内容：；显示：表格；明确：两者皆有；对齐项目：居中；证明内容：中心；保证金：自动； } 平面设计

由于您有两个部分，您可以简单地将它们包装成一个部分，并给它一个名为main的类，然后对其应用flex-box集中化