HTML+CSS练习banner

okstudy

已于 2024-05-31 01:27:12 修改

阅读量149

点赞数 2

分类专栏：前端文章标签： css3 css html 前端 html5

于 2024-05-04 15:37:54 首次发布

本文链接：https://blog.csdn.net/okstudy/article/details/138443113

版权

前端专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
    <title>Document</title>
    <style>
       div{
        height: 500px;
        background-image: url(./bg.png);
        background-position: left bottom;
        background-repeat: no-repeat;
        background-color: #f3f3f4;
        
       }
       a:hover{
       }
       div h1{
        text-align: right;
        font-size: 35px;
        line-height: 100px;
        font-weight: 400;
       }
       div h3{
        text-align: right;
        font-size: 25px;
        line-height: 25px;
        font-weight: 400;
       }
       div p{
        text-align: right;
        height: 45px;
       }
       div p a{
        width: 125px;
        height: 40px;
        line-height: 40px;
        display: inline-block;
        text-align: center;
        background-color: #f06b1f;
        text-decoration: none;
        color: #fff;
        font-size: 20px;
       }
     </style>
</head>
<body>
    <div>
        <h1>让创造产生价值</h1>
        <h3>我们希望小游戏平台可以提供无限的可能性，让每一个创作者都可以将他们的才华和创意传递给用户</h3>
        <p><a href="">我要报名</a></p>
    </div>
</body>
</html>