css背景和边框

css背景呵边框

 #box-1 {
            /* 背景颜色 */
            background-color: bisque;
            /*  背景边框 */
            /* border-width: 3px; */
            /* 边框颜色 */
            /* border-color: aqua; */
            /* 边框样式 */
            /* border-style: solid; */

            /* 复合写法 */
            border: 3px aqua solid;

            /* 设置四个边框圆角 */
            border-radius: 10px;
        }

        #box-2 {
            background-color: #333;
            /* 字体颜色 */
            color: aliceblue;
            /* 边框线 根据 方向设置边框 top，bottom，left， right  */
            border-top: 3px #500531 solid;
            /* 设置方向圆角  */
            /* 左上 */
            border-top-left-radius: 10px;
            /* 左下 */
            border-bottom-left-radius: 10px;
            /* 右上 */
            border-top-right-radius: 10px;
            /* 右下 */
            border-bottom-right-radius: 10px;
        }

        #box-3 {
            /* 背景图片 background-image: url(./imgs/微信图片_20220906105128.jpg); */
            width: 500px;
            height: 400px;
            /* 设置背景图要不要重复 */
            /* background-repeat: no-repeat; */
            /* 设置图片定位 */
            /* background-position: 100px 100px; */
            /* 设置图片铺满全屏 */
            /* background-size: cover; 

            /* 简写复合写法 */
            background: url(./imgs/微信图片_20220906105128.jpg) no-repeat center center / cover;
        }

        #box-4 {
            /* 引入图片 */
            background: url(./imgs/微信图片_20220906104920.jpg) no-repeat center center;
            /* 背景固定 */
            background-attachment: fixed;



        }