页面布局

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了页面布局相关的知识，希望对你有一定的参考价值。

1.display:flex

2.display:tabel-cell

紧靠在一起，一列的效果（背景高度也会被撑高）

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            .t1{
                display: table-cell;
                width:1200px;
                height:120px;
                background: #ccc;
            }
            .t1 div{                
                width:200px;
                height:200px;
                background:red;
                border:solid 2px green;
            }
        </style>
    </head>
    <body>
        <div class="t1">
            <div>555</div>
            <div>555</div>
            <div>555</div>
        </div>
    </body>
</html>

3.vertical-align:middle; 

也是紧靠在一起，一列的效果

以上是关于页面布局的主要内容，如果未能解决你的问题，请参考以下文章

如何通过单击片段内的线性布局从片段类开始新活动？下面是我的代码，但这不起作用

Spring boot：thymeleaf 没有正确渲染片段

Android ViewPager 适配器修改其他页面

没有滚动内容时如何下拉协调器布局

Wordpress - 将代码片段包含到布局的选定部分的插件

有没有更聪明的方法将布局绑定到片段？