美文网首页
css笔记-4/ 实现圆角矩形和阴影怎么做?

css笔记-4/ 实现圆角矩形和阴影怎么做?

作者: joker731 | 来源:发表于2018-01-13 07:32 被阅读129次
    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <title>JS Bin</title>
    </head>
      <style>
        #div1{
          border-radius: 20px;
          background: green;
          padding: 20px; 
          width: 300px;
          height: 100px;   
        }
        #div2{
          margin-top:20px;
          width:300px;
          height:100px;
          background-color:blue;
          box-shadow: 10px 10px 3px #888888; 
        }
      </style>
    <body>
    
      <div id="div1"></div>
      <div id="div2"></div>
    </body>
    </html>
    

    相关文章

      网友评论

          本文标题:css笔记-4/ 实现圆角矩形和阴影怎么做?

          本文链接:https://www.haomeiwen.com/subject/ytoqoxtx.html