HTML5第六课时，margin外边距

来源：互联网发布：生化奇兵海葬知乎编辑：程序博客网时间：2024/06/05 20:51
<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title>margin外边距</title>    <style>        *{            padding: 0;            margin: 0;        }        /*标签选择器*/        div{            height: 300px;            width: 500px;            background-color: #585858;            color: white;            font-size: 50px;            /*margin-left: 262px;假设屏幕是1024，div宽度500，剩下524，除以2得到262，让div居中                但是当浏览器缩小的时候，又不居中了。应该用margin:0 auto*/            margin: 0 auto;            margin-bottom: 30px;            /*line-height: 50px;            文本没有紧贴上方显示，加上行高跟字体大小一样，就可以紧贴着显示*/            /*margin-top: 20px;            margin-left: 50px;            margin-right: 50px;            margin-bottom: 20px;*/            /*上面等价于，margin:20px 50px 50px 20px;顺序是上右下左                如果是margin:20px 50px;就是上下20px，左右50px                如果margin:20px;是上下左右都是20px                如果margin:20px 50px 20px;是上20px，左和右是50px，下是20px*/            text-align: justify;/*文字两端对齐。*/            border-top: 20px dashed red ;            border-right: 20px solid red;            border-bottom: 20px dotted red;            border-left: 20px double red;            /*border会影响文字的区域，但是不会改变div的大小。*/        }        p{            background-color: red;            font-size: 50px;        }    </style></head><body><div>    扭转星辰扭转星辰扭转星辰扭转星辰扭转星辰扭转星辰扭转星辰</div><p>十盗偷天</p></body></html>
0 0