是我电脑的问题吗没有居中

张凤梅 2020-01-01

源自：CSS网页布局基础 2-13 混合布局

收起

3回答

好帮手慕星星回答被采纳获得+3积分 2020-01-02 16:31:10

同学你好，课程中给body设置了text-align属性为center使文本居中：

粘贴的代码中没有设置，可以添加下：

如果我的回答帮助到了你，欢迎采纳，祝学习愉快~

收起回答

提问者张凤梅 2020-01-02 15:34:48

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>混合布局</title>
    <style type="text/css">
        *{
            margin:0;
            padding: 0;
            color:white;
        }
        .head{
            width: 800px;
            height:50px;
            background: blue;
            margin: 0 auto;
            line-height:50px;
        }
        .container{
            width: 800px;
            height: 1000px;
            margin: 0 auto;
        }
        .container .left{
            width: 200px;
            height: 1000px;
            background: green;
            float: left;
        }
        .container .right{
            width: 600px;
            height: 1000px;
            background: #ececec;
            float:left;
        }
        .footer{
            width: 800px;
            height: 100px;
            background: #ed817e;
            margin: 0 auto;
            line-height:100px;
        }
        .banner{
            width: 800px;
            height: 200px;
            background:#8b8d91;
            margin: 0 auto;

        }
    </style>
</head>
<body>
    <div class="head">这是页面的头部</div>
    <div class="banner">这是页面的轮播图</div>
    <div class="container">
        <div class="left">这是页面的左侧</div>
        <div class="right">这是页面的右侧</div>
    </div>
    <div class="footer">这是页面的底部</div>
</body>
</html>

收起回答