CSS理解之padding--非原创

因为在慕课网观看了张大神的视频，学习到了一点东西，向和大家分享。视频地址

代码如下：

DOCTYPE html>
html lang="zh-CN">
head>
    meta charset="UTF-8">
    title>CSS理解之paddingtitle>
    style type="text/css">
        .wrap {
            width: 150px;
            padding: 20px;
            border: 2px solid #ccc;
        }

        .line-tri {
            width: 150px;
            height: 30px;
            padding: 15px 0;
            border-top: 30px solid #000;
            border-bottom: 30px solid #000;
            background-color: #000;
            background-clip: content-box;
        }

        .eye {
            width: 150px;
            height: 150px;
            padding: 10px;
            border: 10px solid #000;
            border-radius: 50%;
            background-color: #000;
            background-clip: content-box;
        }
    style>
head>
body>
    
    div class="wrap">
        div class="line-tri">div>
    div>
    br />
    br />
    br />
    
    div class="eye">div>
body>
html>

代码演示地址