老师您好，麻烦看下有什么需要改进的

来源：4-8 自由编程

慕仔3411021

2020-11-10 00:27:33

# 具体遇到的问题

# 报错信息的截图

# 相关课程内容截图

# 尝试过的解决思路和结果

# 粘贴全部相关代码，切记添加代码注释（请勿截图）

在这里输入代码，可通过选择【代码语言】突出显示
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/css.css">
</head>
<body>
    <div class="about">
        <h1>ABOUT</h1>
        
        <div class="line"></div>
        <div class="word-top">
            <p>Time goes by so fast, people go in and out of your life. You must never miss the opportunity to tell these people how much they mean to you.</p>
        </div>
        
        <div class="bottom">
            <div class="left">
                <h2>A WORD <br>ABOUT US</h2>
                <div class="img">
                    <img src="image/bb3.jpg">
                </div>
                
                <div class="shade">
                    <p>
                        If you wish to succeed, you should use persistence as your good friend, experience as your reference, prudence as your brother and hope as your sentry.
                    </p>
                    <button type="button">
                        EXPLORE
                    </button>
                </div>
            </div>
            <div class="right">
                <div class="num">
                    <h2>70000</h2>
                    
                    <div class="line"></div>
                    <p>Students</p>
                </div>
                <div class="num">
                    <h2>600</h2>
                    
                    <div class="line"></div>
                    <p>Faculty</p>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

*{
    margin: 0;
    padding: 0;
}
/* 横线 */
.line{
    width: 60px;
    height: 3px;
    background-color: #07cbc9;
    margin: 10px auto;
}
.about{
    margin: 0 auto;
    padding-top: 30px;
}
/* 上半部分 */
.about h1{
    font-size: 32px;
    text-align: center;
}
  /*上半部分文字  */
.about .word-top{
    width: 350px;
    margin: 0 auto;
}
.about p{
    font-size: 14px;
    text-align: center;
    color: gray;
}
/* 下半部分 */
.about .bottom{
    width: 1200px;
    height: 464px;
    margin: 0 auto;
    padding-top: 30px;
}
/* 左边 */
.about .bottom .left{
    float: left;
    position: relative;
}
.about .bottom .left h2{
    font-size: 28px;
}
.about .bottom .left .img{
    position: absolute;
    top: 0;
    left: 250px;
}
.about .bottom .left .img img{
    width: 650px;
    height: 435px;
}
/* 遮罩层 */
.about .shade{
    position: absolute;
    left: 0;
    top: 120px;
    background:rgba(255,255,255,0.5);
    padding: 20px;
    border: 1px solid gray;
}
.about .shade p{
    width: 300px;
    font-size: 18px;
    text-align: left;
    margin-bottom: 20px;
    color: black;
}
.about .shade button{
    width: 140px;
    height: 40px;
    background-color: black;
    color: white;
    border: none;
}
/* 右边 */
.about .bottom .right{
    width: 260px;
    height: 400px;
    float: right;
}
.about .bottom .right .num{
    width: 258px;
    text-align: center;
    padding: 40px 0;
    border: 1px solid  #07cbc9;
    margin-bottom: 30px;
}
.about .bottom .right div h2{
    font-size: 28px;
}
.about .bottom .right div p{
    color: black;
}