HTML+CSS练习产品卡片

okstudy

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

阅读量152

点赞数 3

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

于 2024-05-04 15:45:04 首次发布

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

版权

前端专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
    <title>Document</title>
    <style>
      * {
       margin: 0 ;
       padding: 0;
       box-sizing: border-box;
      }
      body{
        background-color: #f4f0f4;
      }
      div{
        width: 250px;
        height: 250px;
        background-color: #fffeff;
        margin: 0 auto;
        margin-top: 100px;
        text-align: center;
        border-radius: 10px;
        overflow: hidden;
        line-height: 10px;
        
      }
      .div{
        width: 80px;
        height: 80px;
        margin-top: 50px;
        background-color: #fc2d59;
        border-radius: 40px;
      }
      div h4{
        margin: 20px;
        margin-top: 30px;
        font-size: 20px;
        font-weight: 400;
        color: #333;
      }
      div p{
        margin: 10px;
        color: #555;
        font-size: 12px;
      }
     </style>
</head>
<body>
  <div>
    <div class="div"><img src="#" alt=""></div>
    
    <h4>抖音直播SDK</h4>
    <p>包含抖音直播功能</p>
  </div>
</body>
</html>