0502边界边框

Posted mjwwzy

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了0502边界边框相关的知识,希望对你有一定的参考价值。

--边界边框

-----外边距:margin      上 top   右 left    下 bottom    左 right

-----内边距:padding    上 top   右 left    下 bottom    左 right

-----边框:border

----------------------------------透明   transparent    

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            #first{
                width: 200px;
                height: 200px;
                background-color: red;
                margin: 30px 40px 50px 60px;
            }
            #second{
                width: 200px;
                height: 200px;
                background-color: red;
            }
            #third{
                /*width: 200px;*/
                width: 170px;
                height: 200px;
                background-color: orange;
                padding-left: 30px;
            }
            #forth{
                width: 300px;
                height: 200px;
                /*border-right: 1px solid black;*/
                border-top: 10px solid red;
                border-right: 10px solid red;
                
            }
            #fifth{
                width: 0px;
                height: 0px;
                border-top: 100px solid red;
                border-left: 100px solid transparent;
                border-bottom: 100px solid transparent;
                border-right: 100px solid transparent;
            }
            #sixth{
                width: 200px;
                height: 200px;
                background-color: red;
                transform: rotate(45deg);
            }
        </style>
    </head>
    <body>
        <div id="first">
            
        </div>
        <div id="second">
            
        </div>
        <div id="third">
            
        </div>
        <div id="forth">
            
        </div>
        <div id="fifth">
            
        </div>
        <div id="sixth">
            
        </div>
    </body>
</html>

技术分享图片

技术分享图片

技术分享图片

 

以上是关于0502边界边框的主要内容,如果未能解决你的问题,请参考以下文章

5.2基础标签:边框,边界

仅在边界外显示的图像 - iOS/Swift

边界与边框,列表与方块

在这个 spark 代码片段中 ordering.by 是啥意思?

边界和边框

0502基础标签学习